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?

A empresa Universal City Studios, detentora dos direitos autorais do King Kong, processou a Nintendo logo após o lançamento de Donkey Kong, pois segundo ela, o game violava os seus direitos. Ela venceu o processo e recebeu da Nintendo uma indenização de quase 2 milhões de dólares.


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.


O filme Mortal Kombat, inspirado no jogo de mesmo nome, faturou 23 milhões de dólares apenas no fim de semana de estreia nos EUA. Ainda sobre este título de sucesso, outra cifra que impressiona é o faturamento ao longo do primeiro ano: 1 bilhão de dólares no mundo todo.


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.


Criar um jogo é muito mais complexo do que parece. São milhares, às vezes, milhões de linhas de código. Isso não é exagero! Apenas o jogo Ultima Online possui 6.006.313 linhas de programação, totalizando 25.103.295 palavras