Até aqui, estudamos cada peça separadamente:

  • Call Stack
  • Event Loop
  • Microtasks e Macrotasks
  • Promises
  • async/await

Agora vamos juntar tudo e responder a pergunta final:

o que realmente acontece quando usamos async/await?

🎯 Objetivo da aula

Ao final desta aula, você será capaz de:

  • Prever a ordem de execução com async/await
  • Entender como await interage com o Event Loop
  • Saber onde microtasks entram no fluxo
  • Evitar bugs de ordem de execução
  • Encerrar o capítulo de assincronicidade com domínio real

Modelo mental definitivo

Guarde este modelo:

  • Código síncrono → Call Stack
  • await → pausa a função
  • Continuação do await → microtask
  • setTimeout e eventos → macrotasks
  • Event Loop → organiza tudo
await não bloqueia o JavaScript — ele reorganiza o fluxo.

Exemplo 1 — async/await básico

 
  async function exemplo() 
  { 
    console.log("Dentro da função");
    await Promise.resolve();
    console.log("Depois do await");
  }
  console.log("Início");
  exemplo();
  console.log("Fim");

Qual será a ordem? 

 
  console.log("Início"); // Saída: Início
  console.log("Dentro da função");
  // Saída: Dentro da função
  console.log("Fim");
  // Saída: Fim
  // Continuação do await (microtask)
  // Saída: Depois do await

O que aconteceu aqui?

  • A função começou a executar normalmente
  • Encontrou um await
  • A função foi pausada
  • A continuação virou uma microtask
  • O Call Stack foi liberado

Exemplo 2 — async/await vs setTimeout

 
  async function teste() 
  { 
    console.log("Async início");
    await Promise.resolve();
    console.log("Async fim");
  }
  setTimeout(() => 
  {
    console.log("Timeout");
  }, 0);
teste();

 
  console.log("Async início"); // Saída: Async início
  // Microtask do await
  console.log("Async fim");
  // Saída: Async fim
  // Depois a macrotask
  console.log("Timeout");
  // Saída: Timeout
await sempre tem prioridade sobre setTimeout.

Exemplo 3 — múltiplos awaits

 
  async function fluxo() 
  { 
    console.log("Passo 1");
    await Promise.resolve();
    console.log("Passo 2");
    await Promise.resolve();
    console.log("Passo 3");
  }
fluxo();

 
  console.log("Passo 1"); // Saída: Passo 1
  // Microtask
  console.log("Passo 2");
  // Saída: Passo 2
  // Nova microtask
  console.log("Passo 3");
  // Saída: Passo 3

Cada await cria uma pausa

Cada await:

  • divide a função em partes
  • agenda a continuação como microtask
  • permite que o Event Loop execute outras tarefas

Exemplo 4 — async dentro de evento

 
  button.addEventListener("click", async () => 
  { 
    console.log("Clique");
    await Promise.resolve();
    console.log("Depois do await");
  });

 
  console.log("Clique"); // Saída: Clique
  // Microtask do await
  console.log("Depois do await");
  // Saída: Depois do await
Mesmo em eventos (macrotasks), microtasks mantêm prioridade.

Resumo visual do fluxo

 Call Stack ↓ await → pausa função ↓ Microtask Queue ↓ Event Loop ↓ Continuação da função

Erro comum: achar que await bloqueia tudo

await NÃO bloqueia o JavaScript inteiro. Ele pausa apenas a função onde está.

Resumo da aula para nunca mais esquecer

  • await pausa a função, não o JavaScript
  • A continuação do await é uma microtask
  • Microtasks têm prioridade sobre macrotasks
  • O Event Loop organiza tudo
  • Agora você consegue prever a execução

Na próxima aula, vamos mudar o foco para outro pilar avançado do JavaScript: Closures avançados.

HARDWARE

Entendendo o seu computador

O que há dentro do meu computador?

Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.

  • Gabinetes

  • Placas-Mãe

  • Processadores

  • Memória

  • Fontes

  • Drives Ópticos

  • Discos Rígidos

  • SSD

  • Placas de Som

  • Placas de Vídeo

Você Sabia?

PDP-1

O primeiro computador a conseguir rodar o jogo Spacewar era o PDP-1, que custava 120 mil dólares e pertencia ao Massachusetts Institute of Technology. O jogo demorou 200 horas para ser desenvolvido, em 1962, e seu criador foi um cientista da computação chamado Steve Russel.

Tetris

Desde o seu lançamento, em 1985, o fantástico jogo Tetris vende pelo menos 70 milhões de unidades por ano em todo o mundo! Os dados são oficiais e fornecidos pela THQ, uma das distribuidoras do título.

Cuidados com o notebook

Utilizar seu notebook em camas, sofás ou qualquer superfície macia pode obstruir as entradas e saídas de ar, elevando a temperatura e provocando danos a diversos componentes. Utilize-o sempre sobre uma superfície rígida. Saiba mais aqui.

Mario em Donkey Kong

O personagem Mario surgiu pela primeira vez no mundo dos games em um jogo chamado Donkey Kong, lançado em 1981. Mario, que naquela época se chamava Jumpman, não era o personagem principal do jogo, mas ele se tornaria um dos mais famosos personagens do mundo dos games. Saiba mais.

Duck Hunt

Ao completar o nível 99 do jogo Duck Hunt, para Nintendo, o jogo retorna ao primeiro nível, mas um bug impede que se acerte os patos neste recomeço. Este é um exemplo do que é chamado no mundo dos games de "Kill Screen".