El método setInterval() siempre invoca la función después del retraso por primera vez usando dos enfoques:
Método 1: llamar a la función una vez antes de ejecutar setInterval: la función simplemente se puede invocar una vez antes de usar la función setInterval. Esto ejecutará la función una vez inmediatamente y luego la función setInterval() se puede configurar con la devolución de llamada requerida.
Se crea una nueva función que encierra primero la invocación de la función y luego llama a la función setInterval() a continuación. Esto ayudará a simular la función setInterval() sin demora por primera vez.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to execute setInterval function without
delay for the first time in JavaScript ?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
Execute the setInterval function
without delay the first time
</b>
<p>
Click on the button to execute the
setInterval() function without delay.
</p>
<button onclick="startSetInterval()">
Start immediate setInterval
</button>
<script type="text/javascript">
let count = 1;
function exampleFunction() {
console.log('Function Executed! ' + count);
count = count + 1;
}
function noDelaySetInterval(func, interval) {
func();
return setInterval(func, interval);
}
function startSetInterval() {
noDelaySetInterval(exampleFunction, 3000);
}
</script>
</body>
</html>
Producción:
- Inmediatamente después de hacer clic en el botón:
- Después de esperar 3 segundos:
Método 2: usar una función de invocación inmediata dentro de la función setInterval: una expresión de función de invocación inmediata (IIFE) es un tipo de función que se invoca inmediatamente después de su declaración. Esta propiedad se puede usar en la devolución de llamada de la función setInterval(), ya que se ejecutaría inmediatamente una vez y luego el setInterval() real con esta función se iniciará después del retraso especificado. Esto ayudará a simular la función setInterval() sin demora por primera vez.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
Execute the setInterval function
without delay the first time
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
Execute the setInterval function
without delay the first time
</b>
<p>
Click on the button to execute the
setInterval() function without delay.
</p>
<button onclick="startSetInterval()">
Start immediate setInterval
</button>
<script type="text/javascript">
function startSetInterval() {
let count = 1;
setInterval(function exampleFunction() {
console.log('Function Executed! ' + count);
count = count + 1;
return exampleFunction;
}(), 3000);
}
</script>
</body>
</html>
Producción:
- Inmediatamente después de hacer clic en el botón:
- Después de esperar 3 segundos:
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA