ES2015 - Promises no Javascript (Parte 1)



01 - Callbacks e Callback Hell

Há algum tempo atrás, todas as vezes em que desenvolvíamos uma aplicação com Javascript e essa começava a escalar, crescer mais e mais, agregando mais e mais funções onde cada uma estava conectada com a outra e, principalmente, dependia uma da outra, tínhamos que utilizar as chamadas Callbacks, que são, basicamente, funções que chamam outra funções em seus parâmetros.

Exemplo:


Nesse exemplo, a função forEach, que pertence ao prototype Array, chama uma função anônima que retorna cada um dos elementos precedido do seu índice.

Ok, legal, quando tempo uma função chamando outra função é tranquilo de lidar, mas imagine por exemplo se fossem 4, 5 ou mais funções sendo chamadas uma dentro de outra. Isso é que o chamamos de "Callback Hell" pois aí fica fácil perder o controle da sua aplicação já que quando for precisar escrever testes ou debugar, tudo vira um inferno para o desenvolvedor.


Foi aí que foi introduzido mais recentemente no Javascript as chamadas Promises. A princípio se tratava de uma biblioteca externa e que só depois de 2015 que foi implementada por completo na linguagem.

02 - O que são e como funcionam as Promises?

Como o próprio nome já indica, Promises são Promessas, é um indicativo de que você possa receber, ou não, algo a partir de uma solicitação feita anteriormente.

Por exemplo, vamos supor que você precise mostrar uma lista de produtos disponíveis num supermercado, a princípio você terá uma função que busca no banco de dados a lista de produtos disponíveis, com seus saldos e preços e também terá uma outra função que organiza e mostra essa lista na tela para o usuário. Bom, para essa segunda função funcionar, será necessário que a primeira tenha sido executada e tenha trazido as informações, correto? Só temos um problema aqui: o Javascript é uma linguagem assíncrona, ou seja, se você simplesmente chamar a primeira função e logo depois chamar a segunda, o que vai ocorrer é um erro.


Para evitar esse erro, utilizamos as Promises, especificando uma função anônima que recebe dois parâmetros: resolve e reject. Sendo o primeiro para tratar a informação quando recebida e o segundo para quando há um erro com o pedido.

Exemplo:



Nesse exemplo eu fiz questão de utilizar a função "fetch" pois ela em si já utiliza o protocolo de Promises.

03 - Como tratar erros em Promises?

Acima nós vemos como podemos obter as respostas a partir das promisses usando a função ".then()", correto? Ela serve para retornar o parâmetro resolve da promise. Caso precisemos tratar o erro, podemos utilizar a função ".catch()".


Por hoje é só mas pretendo aprofundar mais em posts futuros pois tem muita coisa que dá pra fazer com Promises.
Inclusive, pretendo fazer um post sobre o uso de Promises e Obervables e em qual situação usar um ou o outro.

Valeu!


Desenvolvedor apaixonado por tecnologia e também por Games, Filmes e Séries. Ah, e One Piece! :D

flavioflima.com

Próximo
«Anterior
Anterior
Próximo Post »
0 Comentar