Neste artigo irei te explicar o que é, como identificar, usar e criar uma Promise no Javascript
O que é uma promise
Segundo a documentação da mozilla uma promise é:
Promise é um objeto usado para processamento assíncrono. Uma Promise (de "promessa") representa um valor que pode estar disponível agora, no futuro ou nunca.
Porém, eu acho essa explicação um pouco confusa e nada clara principalmente para devs iniciantes. Então bom com as minhas palavras, o que é uma promise? Vamos partir do princípio que uma promise é uma função que demora fazer algo e retornar o resultado (Exemplo: uma busca no banco de dados) e você faz com o que o seu código espere que essa função seja executada e finalizada para continuar com a execução do mesmo.
Para começarmos vamos considerar o trecho de código abaixo.
Aqui temos uma função chamada listarUsuarios que retorna um array de usuarios após 5 segundos usando o setTimeout para simular a espera de uma consulta ao banco de dados. Ela não é nosso objetivo neste momento.
Vamos nos atenta a função main nela chamamos a função listarUsuarios pegamos o resultado e mostramos na tela. Da forma que esta sendo executada a função irá retornar undefined. Mas porquê? Por que não usamos a sintaxe para fazer o código "esperar" que a execução da função acabe e possa executar a linha seguinte.
Abaixo o código que irá retornar os usuários:
O que mudou? Primeiramente sinalizamos na função que irá ocorrer uma chamada assíncrona usando a palavra-chave async na assinatura da função e depois usamos a palavra-chave await para sinalizarmos que queremos que o JS espere a execução daquela função terminar para prosseguir com a execução do código.
Como identificar
Uma função assíncrona sempre será indentifica pela palavra await em frente a sua chamada como no exemplo acima. Então sempre que você ver um await na frente de uma função significa que é assíncrona e levará um tempo para ser executada. E a palavra chave async no começo das funções serve para sinalizar que dentro daquela função uma operação assíncrona é executada ou também posso dizer que uma Promise é executado, sendo o resultado dela reject ou resolve.
Uma Promise também pode ser tratada usando as funções .then() e .catch().
O .then() espera uma função de callback para ser executada quando a operação acabar e ele será chamado apenas quando a Promise for concluída sem erros. Enquanto isso o .catch() faz a mesma coisa, porém sendo executado apenas quando existe algum problema na execução da Promise.
Aqui um exemplo do primeiro código usando essa sintaxe
Vamos um pouco mais fundo
Agora que já te expliquei superficialmente e você já entendeu o que é uma Promise e para que serve as palavras chaves async e await vamos falar um pouco sobre os status da Promise.
Uma Promise pode ter 3 status que são:
pending: estado inicial, nem cumprido, nem rejeitado. Algo como "executando". PS: Esse é o estado que será retornado caso você queira dar um console.log no resultado da Promise sem usar async e await e nem then catch
fulfilled: significa que a promise foi executado com sucesso e retornou o que pretendia.
rejected: significa que a houve um problema e a promise falhou na sua execução.
Ainda existe muita coisa para ser falado sobre Promise. Porém, para uma explicação e entendimento rápido (que o meu objetivo nesse caso) prefiro parar por aqui. Espero que a minha explicação sobre esse assunto um pouco confuso para os iniciantes tenha ajudado.
Caso queira entrar mais a fundo no assunto recomendo muito ler a documentação da própria Mozilla
Muito obrigado por ler 🙃
Top comments (1)
Excelente explicação!!!