Depois de passarmos por 2 estapas
Callback e promise.
Callback é relativamente simples!
Promise já é mais complicada. Mas ela nos salva de um problema do callback!
O inferno de callbacks!
Passamos pela Promise com muita dor(ou não).
Eu sofri uns dias com ela.
Eu entendo que eu sofri com promise por não ter pegado bem callback.
Se você esta aqui, e não entendeu bem promise e callback sugiro voltar lá pra callback, depois promise e por fim chegar aqui em async await.
Assim como promise, async await não é algo inventado no javascript.
Ambas são mais antigas! ambas foram adicionadas, ou os conceitos centrais foram adicionados ao javascript.
Sobre async await eu não irei falar sobre generators.
Se você esta aprendendo, generators não é o ideal(na minha visão) você aprender agora.
Mas saiba, sem generators async await como é hoje no JS poderia não existir :)
Entendemos que generators são importantes para existir async await como conhecemos. Isso basta por enquanto.
Para que serve uma função assíncrona, basicamente para te facilitar a vida imensamente!
Imagina usa uma promise, com seus thens e catch de uma maneira mais parecida com uma simples função?
Trocando em miúdos. É isso!
Uma função assíncrona é uma facilidade para usar promise.
Melhora a escrita e leitura do código.
Promise é legal, funciona(e você vai usar ela em alguns casos) mas vamos dizer, ela é complicadinha.
async await vai trabalhar com promises. Mas debaixo dos panos. Você não vai ver, mas promise vai estar lá!
como declarar uma função assíncrona
Toda função assíncrona, usa a palavra async
Sem ela, a função é comum, sem assincronismo.
async function qualquerNome(qualquercoisa,outraqualuer) {}
const qualaquerNome = async (qualquercoisa,outraqualuer) => {}
Se você quiser saber mais sobre funções assíncronas, como elas são, de onde vieram e tal posso escrever sobre isso do meu jeito.
Mas você pode ver sobre isso aqui> https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Statements/async_function
Continuando.
async function qualquerNome(qualquercoisa,outraqualuer) {
await fazendoalgo()
}
const qualaquerNome = async (qualquercoisa,outraqualuer) => {
await fazendoalgo()
}
await é esperar ou aguardar.
Isso esta sendo autoexplicativo!
No js você só pode usar await dentro de uma função que tenha async. Mas no node você já pode usar sem.
Uma função assincrona usando await espera as coisas serem feitas.
Mas sem atrapalhar o resto do código.
O que estiver fora da função continua normalmente!
Uma função assíncrona é um clousure(que quer dizer fechada ou algo relacionado a fechamento)
Imagine que é uma situação assim: O que acontece dentro dela, fica só nela :)
async function qualquerNome(qualquercoisa,outraqualuer) {
const recebi1 = await fazendoalgo()
const recebi2 = await fazendoalgo2(recebi1)
return recebi2
}
const qualaquerNome = async (qualquercoisa,outraqualuer) => {
const recebi1 = await fazendoalgo()
const recebi2 = await fazendoalgo2(recebi1)
return recebi2
}
Como mostrado no código.
esperamos fazendoalgo() terminar e dar um resultado.
Que colocamos em recebi1.
Depois botamos pra rodar fazendoalgo2()
que tem o dado que ela precisa pra rodar!
Não é lindo?
Isso com promise usaria 2 thens
OBS: você pode usar then com função assíncrona...
funcaoQualquer(recebe1dado).then(exibeDadosDeResposta).catch(deuxabu)
Você pode usar dos 2 jeitos.
Eu prefiro tudo dentro da função mesmo!
PRA MIM, fica mais simples e legível :)
Onde iremos usar uma função assíncrona. Basicamente em qualquer lugar que você usaria uma promise. Ou "quase" todo lugar que precisasse usar uma callback.
Coisas demoradas, buscar no banco, salvar no banco, buscar em uma API de fora. Da pra usar em muitos lugares mesmo!
Para aprender funções assíncronas. Não é complicado de você sabe funções comuns!
As novidades são as palavras async(para o JS entender que aquela função é diferente das outras) e a palavra await(para o JS saber que ele precisa parar ali e esperar o resultado de alguma coisa).
Uma async function sempre espera uma promise dentro dela. :)
Mas claro, você pode não apenas usar promises, pode usar funções comuns dentro dela.
async function funcaoQualquer(palavra){
const teste = await aquiUmaPromise(palavra)
const resultado = await aquiOutraPromise(teste)
const ultimoDado = funcaoNaoPromise(resultado)
}
Esperamos 2 coisas e resolvemos sem promise.
Você precisa saber criar uma Promise.
Pois vai precisar criar uma em algum momento para poder usar depois uma async function :)
Aprenda bem promises, você vai precisar!
async function funcaoQualquer(palavr){
const teste = aquiUmaPromise()
const resultado = aquiOutraPromise()
console.log(await teste, await resultado)
}
Esta é uma maneira de usar! Se você não depende de esperar um resultado para por em outra promise e esperar o resultado disso.
Você pode fazer como fiz acima!
Elas vão rodar em "quase" paralelo. E serão mais rápidas que:
async function funcaoQualquer(palavr){
const teste = await aquiUmaPromise()
const resultado = await aquiOutraPromise()
console.log(teste, resultado)
}
Onde você coloca o await vai interferir na velocidade da resposta.
Se o que tem dentro na função não depende um do outro, pra que esperar um por um?
Não precisa!
O async/await surgiu como uma opção mais "legível" ao .then(), é importante notar que estes não sãoexatamente equivalentes: enquanto async/await faz o processamento de forma sequencial, um await por vez.
Promises com .then() são processadas em paralelo,então ele é mais rápido.
O async/await é simples. Mas não é tão flexível e só funciona com uma Promise por vez.
É importante, muito mesmo aprender Promises.
Vou repetir. É importante demais aprender Promises.
Acho que isso(vou escrever mais sobre em breve, falta muitas coisas ainda)! Se tiver duvidas estou a disposição!
Top comments (0)