Aula 01
Gestão de Promessas no JavaScript com o Async Await
Summary
Resumo da Aula sobre Async e Await no JavaScript
Nesta aula, aprendemos sobre Async e Await, introduzidos no ECMAScript 2017, que simplificam o manuseio de promessas (promises) no JavaScript.
Revisão das Promessas
-
Função FindOne: Exemplifiquei uma função que busca a conta de um usuário no banco de dados pelo ID.
- Essa função retorna uma promessa.
-
Uso de .then():
- Para lidar com a promessa, usamos o método
.then()
. - O que se espera é que, se a conta for encontrada, um objeto com os dados da conta é retornado; caso contrário, uma mensagem de "conta não encontrada" é exibida.
FindOne(id) .then(conta => { console.log("Conta encontrada:", conta); }) .catch(() => { console.log("Conta não encontrada"); });
- Para lidar com a promessa, usamos o método
Introdução ao Async/Await
-
Simplificação do Código: Com a introdução de
async
eawait
, a maneira de lidar com promessas fica mais limpa e fácil de entender. -
Uso de Await:
- Para usar
await
, colocamos antes da chamada de uma função que retorna uma promessa. await
faz com que o código "espere" pela resolução da promessa antes de continuar.
async function buscarConta(id) { const conta = await FindOne(id); console.log("Conta encontrada:", conta); }
- Para usar
-
Diferença Principal:
- O
await
espera o resultado antes de prosseguir para a próxima linha de código, enquanto o.then()
não espera, permitindo que o código continue a execução.
- O
Considerações Finais
- O uso de
async
eawait
fornece uma maneira mais intuitiva e legível de lidar com operações assíncronas em JavaScript. - Na próxima aula, continuaremos explorando mais sobre o uso de
async
eawait
.
Até a próxima!
Video Transcript
Nesta aula nós vamos aprender sobre o Async e Oate, uma nova maneira de lidar com promessas
no JavaScript.
O Async e Oate foi introduzido com o AcmaScript 2017, padrão do AcmaScript 2017, aí já vai
dar pra usar Async e Oate.
Então pra começar vamos primeiro revisar como é que a gente lida com as promessas, a maneira
usual, antes do Async e Oate.
Vamos aqui no editor de texto pra gente escrever um código.
Então vamos supor que você tenha essa função aqui, chamada FindOne, você tá trabalhando
com um aplicativo, aí você tem que fazer o login do usuário.
Vamos supor que no banco de dados tem uma tabela com as contas dos usuários.
Então vamos encontrar a conta do usuário usando o ID dessa conta.
Então essa função FindOne vai levar com argumento aqui o ID da conta.
Vamos supor que o ID da conta é 1, 2, 3, 4.
Então vamos supor que tenha essa função chamada FindOne que leva como argumento aqui, o parâmetro
pra busca no banco de dados.
Então vamos buscar pela conta de ID 1, 2, 3, 4.
Agora a conta pode existir ou a conta pode não existir.
Então a gente vai ver isso quando a gente lida com esse cara aqui.
Vamos supor que a função retorna a promessa.
Como é que a gente lida com a promessa?
Como eu falo promessa é a promise.
Então normalmente a gente fala o ponto Den, aí aqui o argumento vai ser uma função.
Normalmente se é assim, você põe a variável aqui que vai conter o valor daquilo que foi
encontrado pela sua busca.
Nesse caso vai ser um objeto da conta do usuário.
Ou se não encontrar vai ser no...
Aí vamos botar uma função aqui de set ou flash pra definir o que a gente como lida com
a promessa.
A gente chama o FindOne, aí dá o dot Den, aí se tu desce a nossa busca aqui no banco
de dados a função aqui retorna a promessa.
A gente vai lida com o promessa ponto Den e o valor objeto conta aqui.
Aí vamos supor, a gente não vai entrar em detalhes na implementação, quero só dar
um console log assim por exemplo.
Então se for o caso aqui não vai encontrar a conta vai ser no e a gente vai dar o console
log conta não encontrada.
Aí vai dar um return porque a gente não precisa mais fazer nada, não encontrou.
Aí se a conta estiver existe esse cara aqui não vai ser executado, então essa parte
não vai ser executada, vai pra essa parte aqui vamos dizer que conta foi encontrada.
Aí vamos dar o console log da conta mesmo.
Então é assim que a gente faz pra lidar com a promessa usando o dot Den.
Mas agora tem esse negócio de a5 await, foi introduzido no Mac
ManScript 2017 e como é que a gente vai fazer pra usar o a5 await?
Então o a5 await vai fazer esse processo aqui de lidar com a promessa um pouco mais simplificado
e não vai ter precisado adicionar esse bloco aqui de Den dessa maneira.
Então vamos ver como esse cara fica quando você usar o a5 await.
Então vamos escrever a mesma coisa aqui embaixo.
Então a gente vai dar o find1 da mesma maneira, um argumento, um objeto com id 1, 2, 6, 4 da
conta do usuário.
Aí em vez de falar ponto Den a gente vai fazer o seguinte, a gente vai botar await
antes da chamada da função.
A gente sabe que o find1 retorna a promessa.
Aí pra lidar com a promessa a gente vai usar o await antes da chamada.
Aí você vai pôr a conta aqui no lado esquerdo.
Por que?
Porque o que o await faz é o seguinte, ele pega o valor que foi fornecido pela promessa
aqui do find1 se tudo der certo, se der sucesso e pega o valor e põe dentro dessa variável
aqui conta.
Note se você não tiver o await dessa maneira aqui, esse cara retorna o promessa, então
conta vai armazenar o quê?
Armazenar uma promise.
Mas a gente não quer a promise, a gente quer o valor fornecido pela promessa se tudo
der certo.
Então tem que ter o await pra poder desembrular aquela promessa.
Aí você faz a mesma coisa que fez antes, é só botar aqui e um detalhe que o await
vai fazer um negócio síncron, ele vai, quando você chega nessa linha aqui, ele vai chamar
sua função e vai esperar até que a promessa seja realizada aqui.
E depois que esse valor for retornado, fornecido, é que ele vai armazenar e depois disso vai
continuar com os outros comandos.
Então tem esse detalhe que o cara com o await, você tem que esperar por essa linha ser terminada,
né?
O processo aqui de fazer pedido pro banco de dados e receber os dados e mandar o valor
fornecido pra variável, vai esperar tudo.
Certo?
É diferente do anterior, né?
Se você fizer desse jeito aqui, ele não vai esperar pra poder executar os comandos
posteriosos aqui que vem depois, certo?
Essa maneira anterior, ele não vai esperar que o find1 termine pra poder continuar com
os outros, as outras linhas, esse detalhe.
Certo?
Então, por esse vídeo é só e a gente vai continuar no próximo vídeo.
Até mais.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: