Está en la página 1de 7

26 DE AGOSTO DE 2021 / #JAVASCRIPT

JavaScript setTimeout():
Cómo establecer un
temporizador en JavaScript o
esperar durante N segundos
Artículo original escrito por Nathan Sebhastian

Artículo original JavaScript setTimeout() – How to Set


a Timer in JavaScript or Sleep for N Seconds

Traducido y adaptado por Santiago Yanguas

Este tutorial te ayudará a entender cómo funciona el método


incorporado de JavaScript setTimeout() con ejemplos de código
intuitivos.

Como usar setTimeout() en


JavaScript
El método setTimeout() permite ejecutar un fragmento de código,
una vez transcurrido un tiempo determinado. Puedes pensar en el
método como una forma de establecer un temporizador para
ejecutar código de JavaScript en un momento determinado.

Por ejemplo, el código siguiente imprimirá "Hola Mundo" en la


consola de JavaScript después de que hayan pasado 2 segundos:
setTimeout(function(){

console.log("Hola Mundo");

}, 2000);

console.log("setTimeout() Ejemplo...");

setTimeout() Metódo ejemplo

El código anterior imprimirá primero "setTimeout() ejemplo..." en la


consola, luego imprimirá "Hola Mundo" una vez que hayan pasado
dos segundos desde que el código haya sido ejecutado por
JavaScript.

La sintaxis del método setTimeout() es la siguiente:

setTimeout(function, millisegundos, parametro, parametro, ...);

setTimeout() Metódo ejemplo

El primer parámetro del método setTimeout() es una función de


JavaScript para ejecutar. Puedes escribir la función directamente al
pasarla o también puedes hacer referencia a una función con
nombre como se muestra a continuación:

function saludos(){

console.log("Hola Mundo");

setTimeout(saludos);

setTimeout() utilizando una función como argumento


setTimeout() utilizando una función como argumento

A continuación, puede pasar el parámetro milisegundos , que será

la cantidad de tiempo que JavaScript, esperará antes de ejecutar el


código.
Un segundo es igual a mil milisegundos, así que si quieres esperar 3
segundos, tienes que pasar 3000 como segundo argumento:

function saludos(){

console.log("Hola Mundo");

setTimeout(saludos, 3000);

setTimeout() método de dormir durante 3 segundos

Si omite el segundo parámetro, entonces setTimeout() ejecutará


inmediatamente la función pasada sin esperar.

Por último, también puedes pasar parámetros adicionales al método


setTimeout() que puede utilizar dentro de la función de la
siguiente manera:

function saludos(nombre, rol){

console.log(`Hola, mi nombre es ${nombre}`);

console.log(`Yo soy ${rol}`);

setTimeout(saludos, 3000, "Nathan", "Programador");

setTimeout() con parámetros adicionales para la función


Ahora puedes estar pensando, "¿por qué no pasar los parámetros
directamente a la función?"

Esto se debe a que si pasas los parámetros directamente así:

setTimeout(greeting("Nathan", "Software developer"), 3000);

Pasar parámetros a la función

Entonces JavaScript ejecutará inmediatamente la función sin


esperar, porque estás pasando una llamada a la función y no una
referencia a la función como primer parámetro.

Por eso, si necesitas pasar algún parámetro a la función, debes


hacerlo desde el método setTimeout() .

Pero honestamente, nunca encontré la necesidad de pasar


parámetros adicionales al método setTimeout() , en mi papel de
Desarrollador de Software, así que no te preocupes por ello. 😉

Cómo cerrar el método


setTimeout
También puede evitar que el método setTimeout() ejecute la
función utilizando el método clearTimeout() .

El método clearTimeout() requiere el id devuelto por


setTimeout() para saber qué método setTimeout() debe cerrar:

clearTimeout(id);
Sintaxis clearTimeout()

Este es un ejemplo del método clearTimeout() en acción:

const timeoutId = setTimeout(function(){

console.log("Hola Mundo");

}, 2000);

clearTimeout(timeoutId);

console.log(`Tiempo de espera ID ${timeoutId} ha sido limpiado`);

Método clearTimeout() en acción

Si tienes varios métodos setTimeout() , entonces necesitas guardar


los IDs devueltos por cada llamada al método y luego llamar al
método clearTimeout() tantas veces como sea necesario para
borrarlos todos.

Conclusión
El método setTimeout() de JavaScript es un método incorporado
que permite temporizar la ejecución de una determinada función .
Es necesario pasar la cantidad de tiempo a esperar en
milisegundos , lo que significa que para esperar un segundo, es
necesario pasar mil milisegundos .

Para cancelar la ejecución de un método setTimeout() , es


necesario utilizar el método clearTimeout() , pasando el valor del
ID devuelto al llamar al método setTimeout() .
freeCodeCamp es una organización sin fines de lucro exenta de impuestos 501(c)(3)
respaldada por donantes (Número de identificación fiscal federal de los Estados Unidos: 82-
0779546)

Nuestra misión: ayudar a las personas a aprender a programar de forma gratuita. Logramos
esto mediante la creación de miles de videos, artículos y lecciones de programación
interactivas, todos disponibles gratuitamente para el público. También tenemos miles de
grupos de estudio de FreeCodeCamp en todo el mundo.

Las donaciones a freeCodeCamp se destinan a nuestras iniciativas educativas y ayudan a pagar


los servidores, los servicios y el personal.

Puedes hacer una donación deducible de impuestos aquí.

Guías de tendencias

Git Clone UX

Métodos Agile Proceso de Diseño

Python Main Números Primos

Callback Diseño de Producto

Debounce Digital Design

URL Encode Juegos de Código

Blink HTML SVM

Python Tupla JavaScript forEach

JavaScript Push Google BERT

Java List Create Table SQL

Diseño Web Responsive ¿Qué es TLS?

¿Qué es un archivo SVG? ¿Qué es una red LAN?

PDF Password Remover ¿Qué es npm?

¿Qué es un Archivo PDF? Ejemplos de RSync

What Is Python? Random Forest


Nuestra organización sin fines de lucro

Acerca de Red de ex-Alumnos Código abierto Tienda Soporte Patrocinadores

Honestidad Académica Código de Conducta Política de privacidad Términos de servicio

Política de derechos de autor

También podría gustarte