Eventos de tiempo en JavaScript

Eventos que se disparan a un intervalo de tiempo específico para ejecutar el Javascript El código se conoce como eventos de tiempo. Se pueden usar para retrasar la ejecución del código o para ejecutar un bloque de código repetidamente después de un intervalo de tiempo específico. Estos eventos se denominan métodos globales, ya que están directamente disponibles en el HTML DOM y se puede invocar desde cualquier lugar del código.

Cómo ejecutar el código JavaScript después de un intervalo de tiempo específico

Ejecutar Javascript Código Después de un intervalo de tiempo específico, se utiliza el objeto de la ventana.

Hay dos métodos principales/básicos, utilizados para eventos de tiempo:

• función setTimeOut ()
• Función SetInterval ()

Ambas funciones anteriores se utilizan para ejecutar un bloque de código que se les proporciona en función para ejecutar a un intervalo de tiempo específico pero con una diferencia sutil. Comencemos mirando las sintaxis de las funciones y las diferencias entre estas sintaxis:

Función SetTimeout () en JavaScript

La sintaxis de función setTimeOut () es:

setTimeout (función, TimeInterval)
// o
ventana.setTimeout (función, TimeInterval)

Dado que sabemos que el objeto de la ventana se usa para ejecutar el código JavaScript después de un intervalo de tiempo especificado, sin embargo, incluso si no usamos el objeto de la ventana con el setTimeout () o Función SetInterval (), Ambos funcionarán igual.

El función setTimeOut () Toma dos argumentos como parámetros:

• Uno es una función que debe ejecutarse
• El segundo es un intervalo de tiempo en milisegundos, después de lo cual se ejecutará la función especificada en el primer parámetro.

El función setTimeOut () se usa para ejecutar la función proporcionada una vez después de esperar que se complete el intervalo de tiempo.

Cómo detener la ejecución de la función setTimeOut ()

A veces, debemos detener la ejecución de la función definida/llamada en el función setTimeOut () Antes de incluso se alcanza el tiempo mencionado. Por ejemplo, al cargar los datos del servidor, mostramos cargadores en la aplicación web, cuando los datos se obtienen antes del tiempo esperado, podemos detener el cargador y mostrar los datos.

Función ClearTimeOut () en JavaScript

Para detener la ejecución del función setTimeOut (), el Función ClearTimeOut () se usa:

Sintaxis

La sintaxis del Función ClearTimeOut () es:

ClearTimeOut (setTimeoutVariable)

El Función ClearTimeOut () Solo toma el nombre de la variable que devolvió la función setTimeOut ().

Por ejemplo, si hemos llamado al función setTimeOut ():

holdExec = setTimeOut ((() =>
consola.log (hecho);
, 5000)

Ahora, para detener la ejecución del función setTimeOut () Antes de que se complete el intervalo de tiempo, tenemos que proporcionar el "HoldenExec"Variable como argumento para el Función ClearTimeOut () y el Función ClearTimeOut () iría así:

ClearTimeOut (HoldenExec);

Si la función dentro del función setTimeOut () no se ejecuta, entonces la ejecución del función setTimeOut () será detenido.

Función SetInterval () en JavaScript

El Función SetInterval () y su sintaxis es casi la misma que la función setTimeOut () Sin embargo, la única diferencia entre ellos es que el Función SetInterval () Se mantiene ejecutando la función continuamente después de alcanzar el intervalo de tiempo.

La sintaxis de Función SetInterval es:

setInterval (función, TimeInterval)

El Función SetInterval () También toma dos argumentos como parámetros:

• Una es una función que debe ejecutarse cada vez después del intervalo de tiempo especificado.
• El segundo parámetro es un intervalo de tiempo, después del cual la función se ejecutará una y otra vez.

Ahora, la pregunta surge aquí, si el Función SetInterval () sigue ejecutando la función continuamente, ¿cómo podemos detener la ejecución?? La siguiente sección lo explicará:

Cómo detener la ejecución de la función setInterval ()

Bueno, al igual que el Función ClearTimeOut (), También tenemos la opción de detener la ejecución del Función SetInterval ().

Función ClearInterval () en JavaScript

Para detener la ejecución del Función SetInterval (), el Función ClearInterval () se usa:

Sintaxis

La sintaxis del Función ClearInterval () es:

ClearInterval (setIntervalVariable)

El Función ClearInterval () solo toma el nombre de la variable que fue devuelto por el Función SetInterval ().

Por ejemplo, si hemos llamado al Función SetInterval ():

holdExec = setInterval ((() =>
consola.log (retención ...);
, 100)

Ahora, para detener la ejecución del Función SetInterval () Cuando queramos, solo tenemos que proporcionar el "HoldenExec"Variable como argumento para el Función ClearInterval () y el Función ClearInterval () iría así:

ClearInterval (HolteExec);

La ejecución del Función SetInterval () se detendrá justo cuando ejecute el mencionado anteriormente Función ClearInterval ().

Conclusión

JavaScript ofrece a los programadores una serie de métodos para ejecutar asincrónicamente un bloque de código; Estos métodos se llaman eventos de tiempo. Los eventos de tiempo permiten la ejecución periódica del código JavaScript; También permiten que el programador retrase la ejecución de ciertos bloques de código. En este tutorial cubrimos los conceptos básicos de los eventos de tiempo en JavaScript; Aprendimos qué son y cómo usarlos en nuestro código.