Aula 36 — Entendendo Assincronicidade

Até aqui, tudo o que fizemos em JavaScript seguiu uma lógica simples: uma linha executa, depois a próxima, depois a outra.

Mas aplicações modernas precisam lidar com coisas que levam tempo: buscar dados de uma API, esperar uma resposta do servidor, carregar arquivos, aguardar ações do usuário.

Para entender como o JavaScript lida com isso, precisamos compreender um conceito fundamental: assincronicidade.

🎯 Objetivo da aula

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

• Entender o que é código síncrono
• Entender o que é código assíncrono
• Saber por que a assincronicidade é necessária
• Compreender o comportamento do JavaScript diante de tarefas demoradas
• Preparar a mente para Promises, async e await

Primeiro: o que é código síncrono?

Código síncrono é aquele que executa uma tarefa de cada vez, sempre esperando a anterior terminar.

É como uma fila única: só passa para a próxima pessoa quando a atual termina.

 
          console.log("Início"); 
          console.log("Processando"); 
          console.log("Fim"); 

A execução acontece exatamente nessa ordem.

 
            console.log("Início"); 
            // Saída será "Início" 
            console.log("Processando"); 
            // Saída será "Processando" 
            console.log("Fim"); 
            // Saída será "Fim" 

O problema do código síncrono

Agora imagine que uma dessas tarefas demore muito.

Por exemplo: buscar dados de um servidor que leva 5 segundos para responder.

Se o JavaScript esperasse isso de forma síncrona, a página inteira ficaria travada.

A vida real ajuda a entender

Imagine que você está cozinhando:

• Você coloca água para ferver
• Enquanto isso, corta os legumes
• Depois, prepara o molho

Você não fica parado olhando a água ferver.

Isso é pensar de forma assíncrona.

Então… o que é código assíncrono?

Código assíncrono permite que o JavaScript:

• Inicie uma tarefa demorada
• Continue executando outras tarefas
• Volte para a tarefa demorada quando ela terminar

Ou seja: ele não fica esperando parado.

Um primeiro contato com assincronicidade

Veja este exemplo simples usando setTimeout:

 
              console.log("Início");
              setTimeout(() => 
              {
              console.log("Demorado");
              }, 2000);
              console.log("Fim");

Vamos analisar a saída:

 
  console.log("Início"); 
  // Saída será "Início" 
  console.log("Fim"); 
  // Saída será "Fim" 
  console.log("Demorado"); 
  // Saída será "Demorado" (após 2 segundos) 

Mesmo estando no meio do código, o trecho demorado é executado por último.

Isso parece estranho… mas é poderoso

O JavaScript:

• Inicia a tarefa demorada
• Não espera ela terminar
• Continua executando o código
• Volta quando a tarefa fica pronta

Esse comportamento é o que permite:

• Páginas responsivas
• Botões clicáveis enquanto dados carregam
• Aplicações modernas e fluidas

O JavaScript é assíncrono por natureza?

Aqui vai um ponto muito importante:

Esses mecanismos incluem:

• Callbacks
• Promises
• async / await

E é exatamente isso que vamos estudar nas próximas aulas.

Na próxima aula, vamos ver o primeiro mecanismo prático de assincronicidade: Callbacks.