Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Qual a diferença dos codigos ? duvida sobre Promise e Observable

Boa Tarde,

Estou na parte de implementar o método listaTodos() que está desse modo:

@Injectable()
export class AgendamentoDaoProvider {
  // codigo omitido 

  listaTodos(){
    let agendamentos: Agendamento[] = [];

    let promise = this._storage.forEach((agendamento: Agendamento) => {
      agendamentos.push(agendamento);
    }).then(() => agendamentos); // retornando a promise

    return Observable.fromPromise(promise);
  }
export class ListaAgendamentosPage {
  // codigo omitido
  ionViewDidLoad() {
    this._agendamentoDAO.listaTodos()
      .subscribe((agendamentos: Agendamento[]) => {
        this.agendamentos = agendamentos;
      });
  }

Porém qual a diferença de implementar desta maneira aqui:

@Injectable()
export class AgendamentoDaoProvider {
  // codigo omitido 

  listaTodos(){
    let agendamentos: Agendamento[] = [];

    this._storage.forEach((agendamento: Agendamento) => {
      agendamentos.push(agendamento);
    });

    return agendamentos;
  }
export class ListaAgendamentosPage {
  // codigo omitido
  ionViewDidLoad() {
    this.agendamentos = this._agendamentoDAO.listaTodos();
  }

Eu gostaria de saber qual o motivo ... É uma boa pratica ? É uma vantagem ? Qual a necessidade ?

Enfim, se alguém puder me dar uma luz eu agradeço.

Obrigado,

João Vitor.

4 respostas

Alguém ?

solução!

Boa tarde, João! Como vai?

Quando vc escreve um código assim:

listaTodos() {
    let agendamentos: Agendamento[] = [];

    this._storage.forEach((agendamento: Agendamento) => {
      agendamentos.push(agendamento);
    });

    return agendamentos;
  }

Ao chamar o método listaTodos(), não há nenhuma garantia que vc irá obter o array de objetos completo como queria. Isso acontece pq o JavaScript é assíncrono por natureza, de modo que quando ele passar pelo this._storage.forEach(), na mesma hora ele vai retornar um Promise que significa pro programado:

Olha, eu estou processando o seu pedido! Então guarde essa promessa de que eu estou processando ela e verifique se ela será cumprida ou não!

É justamente por isso que no código do curso eu fiz:

let promise = this._storage.forEach((agendamento: Agendamento) => {
      agendamentos.push(agendamento);
    }).then(() => agendamentos);

Dessa forma, com a utilização do método then(), eu indico como a Promise deve ser tratada em caso de sucesso! Nesse caso, simplesmente retornando o array completo!

Então as Promises são a funcionalidade padrão do JavaScript para tratamento de casos como esse que envolvem execuções assíncronas.

No entanto, como estamos trabalhando com Ionic 3 que utiliza o Angular 2+ por baixo dos panos, então a boa prática é utilizar os Observables do RxJS que é a biblioteca utilizada pelo Angular 2+ para tratamento de execuções assíncronas!

E é pra seguir essa boa prática que durante o curso eu dou um passo além e faço:

return Observable.fromPromise(promise);

Retornando um Observable em vez de uma Promise.

Pegou a ideia?

Esse e outros assuntos são tratados nos cursos de JavaScript Avançado e no curso de Angular 2 aqui da Alura! O de Angular é pré-requisito do meu curso de Ionic 3 e os de JavaScript Avançado são pré-requisitos do curso de Angular! Seguem os links:

  • Angular 2:

https://cursos.alura.com.br/course/angular2-parte1

https://cursos.alura.com.br/course/angular2-parte2

  • JavaScript Avançado:

https://cursos.alura.com.br/course/javascript-es6-orientacao-a-objetos-parte-1

https://cursos.alura.com.br/course/javascript-es6-orientacao-a-objetos-parte-2

https://cursos.alura.com.br/course/javascript-es6-orientacao-a-objetos-parte-3

Então, eu indico fortemente que vc assista esses cursos pq lá o mestre Flávio irá te explicar com maestria sobre isso fora que vc irá se aprofundar bem mais nesse assunto e em vários outros relacionados à linguagem JavaScript que te servirão como base para entender de maneira melhor o que acontece no mundo dos frameworks como é o caso do Ionic 3.

Grande abraço e bons estudos!

Sensacional mestre,

Obrigado pela explicação.

Por nada, João! Sempre que tiver qualquer dúvida é só mandar aqui no fórum!

Grande abraço e bons estudos, meu aluno!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software