Minha classe está consumindo um webservice de clima tempo através do método _interceptaClima()
. Percebam que eu vou tratando a resposta através de callbacks.
O problema é que no método calculaDesafio()
, onde eu efetivamente implemento a regra de acordo com a resposta, eu preciso retornar um valor porém não estou conseguindo lidar com esse problema de escopo (Tentei declarar a variável desafio antes mas obviamente falhou pois o escopo é diferente).
Como retornar o/um resultado obtido dentro da callback no retorno da função que está encapsulando ela? Pensei e tentei aplicar o uso do Reflect mas acho que não é o caso.
Acho que pode ser uma pergunta interessante para abordarmos conceitos sobre escopo, callbacks, etc..
Obrigado!
PS. Pesquisei sobre promises e acho que pode ser uma saída porém queria verificar o problema nesse contexto atual.
class DiariaDinamica {
constructor(objetivoMensal, valorVendido) {
this.data = new Date();
this.objetivoMensal = objetivoMensal;
this.valorVendido = valorVendido;
this._valorFaltante = this.objetivoMensal - this.valorVendido;
this._diariaProporcional = this._valorFaltante / this._diasRestantes();
};
calculaDesafio() {
let desafio;
this._consultaClima(respostaConsulta => { // respostaConsulta é um booleano
if (respostaConsulta) {
desafio = this._diariaProporcional * 1.10;
};
});
return desafio; // retorna undefined
};
_interceptaClima(callback) {
ClimaService.consultaClima((err, id) => {
if (err) {
console.log(err);
return
}
callback(id);
});
};
_consultaClima(callback) {
this._interceptaClima((id) => {
let respostaConsulta = this._climaFavoravel().includes(id)
callback(respostaConsulta);
});
};
_climaFavoravel() {
const listaDeId = [
200, 201, 202, 210, 211, 212, 221, 230, 231, 232,
300, 301, 302, 310, 311, 312, 313, 314, 321,
500, 501, 502, 503, 520, 522, 531, 504,
800, 801, 802, 804 // Tirar o 800, 801, 802;
];
return listaDeId;
};
};
SEGUE CÓDIGO DA VIEW:
class ResultadoView {
constructor() {
let $ = document.querySelector.bind(document)
this.divFormulario = $('.formulario')
this.divResposta = $('#principal')
this.divAreaSugestao = $('#sugestao')
}
update(novaDiaria) {
this.divResposta.innerHTML = this._templateResultados(novaDiaria)
};
_templateResultados(novaDiaria) {
let data = new Date()
return `
<table id="tabelaResultados">
<thead></thead>
<tr>
<td colspan='2'>${data.getDate()}/${data.getMonth() + 1}<img src='_assets/calendario-oficial.png' id='calendario-mini'></td>
<td rowspan='6' id='cadastre-se' style='text-align: center'><button type='submit' id='btn-cadastrar'>Cadastre-me</button></td>
</tr>
<tr>
<td>Desafio</td>
<td>${novaDiaria.calculaDesafio().toLocaleString('pt-BR', {style: 'currency', 'currency': 'BRL'}) : ''}</td>
</tr>
<tr>
<td>Diária proporcional</td>
<td>${novaDiaria.diariaProporcional.toLocaleString('pt-BR', {style: 'currency', 'currency': 'BRL'})}</td>
</tr>
<tr>
<td>Mínimo (85%)</td>
<td>${novaDiaria.calculaMinima().toLocaleString('pt-BR', {style: 'currency', 'currency': 'BRL'})}</td>
</tr>
<tr>
<td>Falta pra bater</td>
<td>${novaDiaria.valorFaltante.toLocaleString('pt-BR', {style: 'currency', 'currency': 'BRL'})}</td>
</tr>
<tr id='projecao'>
<td>Projeção atual (%)</td>
<td>${novaDiaria.calculaProjecao().toFixed(2)}%</td>
</tr>
</table>
`
};
calculaDesafio
?