LECCIÓN 41 / 60 · Asincronía y APIs

Espera una acción con setTimeout

Al terminar, podrás: programar una acción con setTimeout

Ampliación opcionalJavaScript

Conviene conocer: Lección 24 · Escribe una función flecha

La idea clave

No todas las tareas terminan de inmediato. setTimeout pide que una función se ejecute después de un tiempo aproximado, sin parar el resto del código.

Este ejemplo muestra la idea en acción. Sigue los pasos y después cámbialo tú.

Ejemplo explicado

console.log('Primero');
setTimeout(() => {
  console.log('Después de esperar');
}, 500);
console.log('Mientras tanto');

El primer mensaje aparece inmediatamente.
setTimeout programa un mensaje para más tarde; 500 significa medio segundo.
El resto del código sigue y muestra «Mientras tanto» antes de terminar la espera.

Antes de empezar, piensa: ¿Cuál aparece antes: «Mientras tanto» o «Después de esperar»?

Cambia la espera de 500 a 1000 y observa el orden.

El resultado que buscamos

El orden sigue siendo Primero, Mientras tanto y Después de esperar; la última línea tarda aproximadamente un segundo.

JAVASCRIPT Practica aquí

Tu misión

Cambia la espera de 500 a 1000 y observa el orden.

Editor de JavaScript · Ctrl/Cmd + Enter

console.log('Primero');
setTimeout(() => {
  console.log('Después de esperar');
}, 500);
console.log('Mientras tanto');

Consola

Lista para ejecutar.

Sin comprobar

Escribe tu cambio y pulsa «Comprobar solución». Puedes intentarlo tantas veces como quieras.

Listo

Necesito una pista

1000 milisegundos equivalen a un segundo.

Una pista más

Modifica el segundo argumento de setTimeout.

Ver solución y explicación

setTimeout(() => { console.log('Después de esperar'); }, 1000);

Qué debes recordar: setTimeout programa una acción posterior sin detener el resto del código.

Práctica pendiente de corregir

La lectura, las prácticas corregidas y las autoevaluaciones guiadas se guardan por separado en este navegador.