Establecer tiempo de espera de JavaScript ()

los setTimeout() El método ejecuta un bloque de código después del tiempo especificado. El método ejecuta el código una sola vez.

La sintaxis comúnmente utilizada de JavaScript setTimeout es:

setTimeout(function, milliseconds);

Sus parámetros son:

• función – una función que contiene un bloque de código
• milisegundos – el tiempo después del cual se ejecuta la función

los setTimeout() método devuelve un ID de intervaloque es un entero positivo.

Ejemplo 1: mostrar un texto una vez después de 3 segundos

// program to display a text using setTimeout method
function greet() {
    console.log('Hello world');
}

setTimeout(greet, 3000);
console.log('This message is shown first');

Producción

This message is shown first
Hello world

En el programa anterior, el setTimeout() método llama al greet() función después 3000 milisegundos (3 segundo).

Por lo tanto, el programa muestra el texto Hola Mundo solo una vez despues 3 segundos.

Nota: Los setTimeout() El método es útil cuando desea ejecutar un bloque de una vez después de un tiempo. Por ejemplo, mostrar un mensaje a un usuario después del tiempo especificado.

los setTimeout() método devuelve la identificación del intervalo. Por ejemplo,

// program to display a text using setTimeout method
function greet() {
    console.log('Hello world');
}

let intervalId = setTimeout(greet, 3000);
console.log('Id: ' + intervalId);   

Producción

Id: 3
Hello world

Ejemplo 2: Visualización del tiempo cada 3 segundos

// program to display time every 3 seconds
function showTime() {

    // return new date and time
    let dateTime= new Date();

    // returns the current local time
    let time = dateTime.toLocaleTimeString();

    console.log(time)

    // display the time after 3 seconds
     setTimeout(showTime, 3000);
}

// calling the function
showTime();

Producción

5:45:39 PM
5:45:43 PM
5:45:47 PM
5:45:50 PM
..................

El programa anterior muestra la hora cada 3 segundos.

los setTimeout() El método llama a la función solo una vez después del intervalo de tiempo (aquí 3 segundos).

Sin embargo, en el programa anterior, dado que la función se llama a sí misma, el programa muestra la hora cada 3 segundos.

Este programa se ejecuta indefinidamente (hasta que se agote la memoria).

Nota: Si necesita ejecutar una función varias veces, es mejor usar el setInterval() método.

JavaScript clearTimeout()

Como ha visto en el ejemplo anterior, el programa ejecuta un bloque de código después del intervalo de tiempo especificado. Si desea detener esta llamada de función, puede utilizar el clearTimeout() método.

la sintaxis de clearTimeout() método es:

clearTimeout(intervalID);

Aquí el intervalID es el valor de retorno de la setTimeout() método.

Ejemplo 3: usar el método clearTimeout()

// program to stop the setTimeout() method

let count = 0;

// function creation
function increaseCount(){

    // increasing the count by 1
    count += 1;
    console.log(count)
}

let id = setTimeout(increaseCount, 3000);

// clearTimeout
clearTimeout(id); 
console.log('setTimeout is stopped.');

Producción

setTimeout is stopped.

En el programa anterior, el setTimeout() método se utiliza para aumentar el valor de contar después de 3 segundos. sin embargo, el clearTimeout() El método detiene la llamada de función del setTimeout() método. Por lo tanto, la contar el valor no se incrementa.

Nota: Generalmente usas el clearTimeout() cuando necesite cancelar el setTimeout() llamada al método antes de que suceda.

También puede pasar argumentos adicionales al setTimeout() método. La sintaxis es:

setTimeout(function, milliseconds, parameter1, ....paramenterN);

Cuando pasa parámetros adicionales al setTimeout() método, estos parámetros (parameter1, parameter2etc.) se pasarán al especificado función.

Por ejemplo,

// program to display a name
function greet(name, lastName) {
    console.log('Hello' + ' ' + name + ' ' + lastName);
}

// passing argument to setTimeout
setTimeout(greet, 1000, 'John', 'Doe');

Producción

Hello John Doe

En el programa anterior, dos parámetros John y Doe se pasan a la setTimeout() método. Estos dos parámetros son los argumentos que se pasarán a la función (aquí, greet() función) que se define dentro de la setTimeout() método.

Lectura recomendada: JavaScript asíncrono () y espera ()