CodeAventura
Asincronía y APIs en JavaScript
▸Fundamentos de asincronía▸Código síncrono vs asíncrono

Misión

<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Asincronía y APIs</title>
  </head>
  <body>
    <h1>Asincronía y APIs</h1>
    <p id="estado">Listo para practicar</p>
    <script src="script.js"></script>
  </body>
</html>
●localhost:5173
Consola
01 / 14Código síncrono vs asíncrono

Código síncrono vs asíncrono

Empecemos desde lo más básico

Antes de trabajar con tareas que tardan, primero hay que entender una idea simple: en qué orden se ejecutan las líneas de código.

En JavaScript vamos a encontrar dos comportamientos:

  • Síncrono: todo va paso a paso, en fila
  • Asíncrono: algunas tareas se programan para después, y el programa sigue

Ejecución síncrona

Salida esperada en consola (orden):

  1. 1. Inicio
  2. 2. Proceso
  3. 3. Fin

Aquí no hay sorpresas: la línea 1 termina, luego la 2, luego la 3.

Primera mirada a lo asíncrono

Salida esperada en consola (orden):

  1. 1. Antes del temporizador
  2. 2. Después del temporizador
  3. 3. Mensaje diferido

Aunque el setTimeout está en medio del código, su mensaje aparece al final porque se ejecuta más tarde.

Incluso con 0 milisegundos

Muchas personas creen que setTimeout(..., 0) se ejecuta “de inmediato”. No: se agenda para después del bloque síncrono actual.

Salida esperada en consola (orden):

  1. 1. Inicio
  2. 2. Fin del bloque síncrono
  3. 3. Timeout 0ms

Aunque el delay sea 0, sigue siendo asíncrono.

Qué debes llevarte hoy

  • El código síncrono mantiene orden directo.
  • El código asíncrono también tiene orden, pero no siempre coincide con el orden visual de las líneas.
  • setTimeout es una forma simple de ver esa diferencia.

Error típico al empezar

Pensar: “si está escrito antes, debería salir antes”. En asincronía no siempre pasa eso, y justo por eso estamos practicándolo desde el inicio.

Tu desafío 🚀

  1. Escribe tres console.log síncronos
  2. Añade un setTimeout entre ellos
  3. Comprueba el orden real en consola y compáralo con lo que esperabas

Entender el orden de ejecución te da una base sólida para todo lo que sigue.