Funções assíncronas - JavaScript

Prévia do material em texto

Funções assíncronas - JavaScript 1
Funções assíncronas - 
JavaScript
Em JavaScript, funções assíncronas são aquelas que não bloqueiam o fluxo de 
execução do programa enquanto aguardam a conclusão de uma operação assíncrona, 
como uma requisição de rede ou uma consulta a um banco de dados. Elas permitem 
que o código continue sendo executado normalmente enquanto aguardam o resultado 
da operação assíncrona.
As funções assíncronas são definidas usando a palavra-chave async antes da palavra-
chave function . Essa declaração especial indica que a função será assíncrona e que 
pode conter o operador await , que é usado para esperar a conclusão de uma Promise 
(vou falar mais sobre Promises adiante).
Aqui está um exemplo de uma função assíncrona simples:
async function minhaFuncaoAssincrona() { 
 // Código assíncrono 
 const resultado = await outraFuncaoAssincrona(); 
 console.log(resultado); 
} 
 
minhaFuncaoAssincrona();
Funções assíncronas - JavaScript 2
Nesse exemplo, a função minhaFuncaoAssincrona é declarada como assíncrona usando a 
palavra-chave async . Em seu corpo, usamos o operador await para esperar a 
conclusão da função outraFuncaoAssincrona . A função await pausa a execução da 
função assíncrona até que a Promise retornada por outraFuncaoAssincrona seja resolvida 
ou rejeitada.
Dessa forma, a função assíncrona permite que o código aguarde o resultado da 
operação assíncrona sem bloquear a execução das instruções seguintes. Assim que a 
Promise é resolvida ou rejeitada, a execução continua.
Promises:
As Promises são um mecanismo fundamental para trabalhar com código assíncrono 
em JavaScript. Elas representam um valor que pode estar disponível agora, no futuro 
ou nunca. As Promises são usadas para encapsular operações assíncronas e fornecer 
uma maneira estruturada de lidar com seus resultados ou erros.
Uma Promise tem três estados possíveis:
1. Pendente (Pending): Estado inicial, quando a Promise está aguardando a 
conclusão da operação assíncrona.
2. Resolvida (Fulfilled): Estado quando a operação assíncrona é concluída com 
sucesso e o resultado está disponível.
3. Rejeitada (Rejected): Estado quando ocorre um erro durante a operação 
assíncrona.
Você pode criar uma Promise usando seu construtor e passando uma função que 
contém a lógica da operação assíncrona. Essa função recebe dois parâmetros: resolve 
e reject , que são funções de callback para indicar a resolução ou rejeição da Promise.
Aqui está um exemplo de criação e uso de uma Promise:
function obterDadosAssincronamente() { 
 return new Promise((resolve, reject) => { 
 setTimeout(() => { 
 const sucesso = true; 
 
 if (sucesso) { 
 resolve('Dados obtidos com sucesso!'); 
 } else { 
Funções assíncronas - JavaScript 3
 reject(new Error('Erro ao obter os dados.')); 
 } 
 }, 2000); 
 }); 
} 
 
obterDadosAssincronamente() 
 .then((resultado) => { 
 console.log(resultado); 
 }) 
 .catch((erro) => { 
 console.error(erro); 
 });
Nesse exemplo, a função obterDadosAssincronamente retorna uma nova Promise. Dentro 
da função construtora da Promise, usamos um setTimeout simulando uma operação 
assíncrona que leva 2 segundos para ser concluída. Se a operação for bem-sucedida, 
chamamos a função resolve com o resultado. Caso contrário, chamamos a função 
reject com um objeto Error contendo a descrição do erro.
Depois de criar a Promise, usamos os métodos .then() e .catch() para lidar com a 
resolução ou rejeição da Promise. O método .then() recebe uma função de callback 
que será executada quando a Promise for resolvida, passando o resultado como 
argumento. O método .catch() recebe uma função de callback que será executada 
quando a Promise for rejeitada, recebendo o objeto de erro como argumento.
Essa é apenas uma introdução às Promises. Além dos métodos .then() e .catch() , as 
Promises possuem outros recursos poderosos, como o encadeamento de Promises 
usando .then() e o uso de async/await para uma sintaxe mais concisa e legível.
As funções assíncronas e as Promises são ferramentas essenciais no JavaScript 
moderno para lidar com operações assíncronas de maneira mais eficiente, evitando o 
"callback hell" e proporcionando um código mais claro e estruturado.
Espero que essas explicações detalhadas tenham sido úteis para você compreender as 
funções assíncronas e as Promises em JavaScript. Fique à vontade para explorar mais 
exemplos e aprofundar seus conhecimentos nesses temas!
Encadeamento de Promises:
Funções assíncronas - JavaScript 4
Uma das principais vantagens das Promises é a capacidade de encadear várias 
operações assíncronas de forma mais legível e estruturada. Isso é feito usando o 
método .then() para retornar uma nova Promise dentro da função de callback.
Veja um exemplo de encadeamento de Promises:
function obterDadosAssincronamente() { 
 return new Promise((resolve, reject) => { 
 setTimeout(() => { 
 const sucesso = true; 
 
 if (sucesso) { 
 resolve('Dados obtidos com sucesso!'); 
 } else { 
 reject(new Error('Erro ao obter os dados.')); 
 } 
 }, 2000); 
 }); 
} 
 
function processarDados(dados) { 
 return new Promise((resolve, reject) => { 
 setTimeout(() => { 
 const processado = dados.toUpperCase(); 
 
 if (processado) { 
 resolve(processado); 
 } else { 
 reject(new Error('Erro ao processar os dados.')); 
 } 
 }, 2000); 
 }); 
} 
 
obterDadosAssincronamente() 
 .then((dados) => processarDados(dados)) 
 .then((resultado) => { 
 console.log(resultado); 
 }) 
 .catch((erro) => { 
 console.error(erro); 
 });
Nesse exemplo, a função obterDadosAssincronamente retorna uma Promise que obtém os 
dados de forma assíncrona. Em seguida, usamos o método .then() para encadear 
Funções assíncronas - JavaScript 5
uma nova Promise, processarDados , que processa os dados obtidos. Por fim, usamos 
outro .then() para lidar com o resultado final.
Observe como o encadeamento de Promises permite que as operações assíncronas 
sejam executadas sequencialmente, uma após a outra, mantendo o código organizado 
e legível. Isso é especialmente útil quando temos dependências entre diferentes 
operações assíncronas.
Async/Await:
Além do encadeamento de Promises com .then() , o JavaScript moderno introduziu a 
sintaxe async/await para lidar com código assíncrono de forma mais síncrona e 
semelhante à programação tradicional.
As funções assíncronas marcadas com a palavra-chave async podem usar o operador 
await para aguardar a conclusão de uma Promise. Isso permite que o código pareça 
ser síncrono, mesmo lidando com operações assíncronas.
Veja um exemplo de uso do async/await :
function obterDadosAssincronamente() { 
 return new Promise((resolve, reject) => { 
 setTimeout(() => { 
 const sucesso = true; 
 
 if (sucesso) { 
 resolve('Dados obtidos com sucesso!'); 
 } else { 
 reject(new Error('Erro ao obter os dados.')); 
 } 
 }, 2000); 
 }); 
} 
 
function processarDados(dados) { 
 return new Promise((resolve, reject) => { 
 setTimeout(() => { 
 const processado = dados.toUpperCase(); 
 
 if (processado) { 
 resolve(processado); 
 } else { 
 reject(new Error('Erro ao processar os dados.')); 
 } 
 }, 2000); 
 }); 
} 
 
Funções assíncronas - JavaScript 6
async function executarOperacoesAssincronas() { 
 try { 
 const dados = await