Capítulo 12: Assincronismo com Async/Await ⚡🕶️

Neste capítulo, vamos aprender a forma mais moderna e limpa de trabalhar com assincronismo em JavaScript: as palavras-chave async e await, continuando com o tema Matrix!


📖 O que é Async/Await?

O async/await é uma forma de escrever código assíncrono que parece síncrono. Ele foi criado para evitar o “Promise Hell” (quando temos muitos .then() encadeados).

  • async: Transforma uma função comum em uma função que retorna uma Promise.
  • await: Pausa a execução da função até que a Promise seja resolvida (só pode ser usado dentro de funções async).

📖 Exemplo Guiado: Treinamento de Neo

Vamos simular o Neo aprendendo Kung Fu instantaneamente (mas com uma pequena demora de processamento).

  1. Crie o arquivo treinamento_neo.js na pasta src/:
// Função que retorna uma Promise
const carregarTreinamento = (habilidade) => {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve(`Treinamento de ${habilidade} concluido!`);
        }, 2000);
    });
};
 
// Função Assíncrona
const iniciarTreinamento = async () => {
    console.log("Iniciando upload de habilidades para o cérebro do Neo...");
    
    // O await espera a Promise resolver antes de ir para a próxima linha
    const resultado1 = await carregarTreinamento("Kung Fu");
    console.log(resultado1);
    
    const resultado2 = await carregarTreinamento("Pilotar Helicoptero");
    console.log(resultado2);
    
    console.log("Neo: 'Eu sei lutar!'");
};
 
iniciarTreinamento();

🕹️ Como Executar e Testar no VS Code

  1. Abra o terminal integrado.
  2. Execute: node treinamento_neo.js

Resultado Esperado:

Iniciando upload de habilidades para o cérebro do Neo...
(espera 2 segundos...)
Treinamento de Kung Fu concluido!
(espera 2 segundos...)
Treinamento de Pilotar Helicoptero concluido!
Neo: 'Eu sei lutar!'

📊 Ilustração Visual: Fluxo com Await

Veja como o código parece esperar, mas de forma inteligente:

graph TD
    A[Início da função async] --> B[await carregarTreinamento]
    B -->|Espera resolver| C[Exibe resultado]
    C --> D[Próxima linha...]

🛠️ Prática Obrigatória 1: Desviando de Balas

Crie uma função desviarBalas que retorne uma Promise que resolve após 1 segundo com a mensagem “Neo desviou das balas!“. Chame essa função dentro de uma função assíncrona usando await e exiba o resultado.


🔑 Gabarito de Código

Prática 1: desviar_balas.js

const desviarBalas = () => {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve("Neo desviou das balas!");
        }, 1000);
    });
};
 
const acao = async () => {
    const resultado = await desviarBalas();
    console.log(resultado);
};
 
acao();

📤 Instruções de Entrega (GitHub Desktop + Microsoft Teams)

(Siga o padrão estabelecido no Guia)


Capitulo Anterior | Proximo Capitulo