una - reloj javascript setinterval

Ejecute la función setInterval sin demora la primera vez

Question

Es allí una forma de configurar el método setInterval de javascript para ejecutar el método inmediatamente y luego ejecutarlo con el temporizador

Answer 1

Aquí hay un envoltorio para embellecerlo si lo necesitas:

(function() {
    var originalSetInterval = window.setInterval;

    window.setInterval = function(fn, delay, runImmediately) {
        if(runImmediately) fn();
        return originalSetInterval(fn, delay);
    };
})();

Establezca el tercer argumento de setInterval en verdadero y se ejecutará por primera vez inmediatamente después de llamar a setInterval:

setInterval(function() { console.log("hello world"); }, 5000, true);

O omita el tercer argumento y mantendrá su comportamiento original:

setInterval(function() { console.log("hello world"); }, 5000);

Algunos navegadores admiten argumentos adicionales para setInterval que este contenedor no tiene en cuenta; Creo que rara vez se usan, pero tenlo en cuenta si los necesitas.

Answer 2

Aquí hay una versión simple para los principiantes sin toda la confusión. Simplemente declara la función, la llama y luego inicia el intervalo. Eso es.

//Declare your function here
function My_Function(){
  console.log("foo");
}    

//Call the function first
My_Function();

//Set the interval
var interval = window.setInterval( My_Function, 500 );

Answer 3

Es más simple llamar la función directamente la primera vez:

foo();
setInterval(foo, delay);

Sin embargo, existen buenas razones para evitar setInterval : en particular, en algunas circunstancias, una carga completa de eventos setInterval puede llegar inmediatamente una detrás de la otra sin demora. Otra razón es que si desea detener el bucle, debe llamar explícitamente a clearInterval que significa que debe recordar el identificador devuelto por la llamada setInterval original.

Entonces, un método alternativo es hacer que foo active para las llamadas subsiguientes usando setTimeout en setTimeout lugar:

function foo() {
   // do stuff
   // ...

   // and schedule a repeat
   setTimeout(foo, delay);
}

// start the cycle
foo();

Esto garantiza que hay al menos un intervalo de delay entre las llamadas. También hace que sea más fácil cancelar el bucle si es necesario, simplemente no llama a setTimeout cuando se setTimeout su condición de terminación de bucle.

Mejor aún, puede envolver todo eso en una expresión de función invocada de inmediato, que crea la función, que luego se llama a sí misma como se indica anteriormente e inicia automáticamente el ciclo:

(function foo() {
    ...
    setTimeout(foo, delay);
})();

que define la función y comienza el ciclo todo de una vez.

Answer 4

Existe un problema con la llamada asíncrona inmediata de su función, porque setTimeout / setInterval estándar tiene un tiempo de espera mínimo de varios milisegundos, incluso si lo configura directamente a 0. Esto se debe a un trabajo específico del navegador.

Un ejemplo de código con un retardo de cero REAL que funciona en Chrome, Safari, Opera

function setZeroTimeout(callback) {
var channel = new MessageChannel();
channel.port1.onmessage = callback;
channel.port2.postMessage('''');
}

Puedes encontrar más información here

Y después de la primera llamada manual, puede crear un intervalo con su función.

Answer 5

Hay un conveniente paquete npm llamado firstInterval (revelación completa, es mío).

Muchos de los ejemplos aquí no incluyen el manejo de parámetros, y cambiar los comportamientos predeterminados de setInterval en cualquier proyecto grande es malo. De la documentación:

Este patrón

setInterval(callback, 1000, p1, p2);
callback(p1, p2);

es idéntico a

firstInterval(callback, 1000, p1, p2);

Si estás en la escuela secundaria en el navegador y no quieres la dependencia, es fácil cortar y pegar desde el código.

Answer 6

Me encontré con esta pregunta debido al mismo problema, pero ninguna de las respuestas ayuda si necesita comportarse exactamente como setInterval() pero con la única diferencia de que la función se llama inmediatamente al principio.

Aquí está mi solución a este problema:

function setIntervalImmediately(func, interval) {
  func();
  return setInterval(func, interval);
}

La ventaja de esta solución:

• El código existente que usa setInterval se puede adaptar fácilmente mediante sustitución
• trabaja en modo estricto
• Funciona con funciones nombradas existentes y cierres.
• todavía puede usar el valor de retorno y pasarlo a clearInterval() más tarde

Ejemplo:

// create 1 second interval with immediate execution
var myInterval = setIntervalImmediately( _ => {
        console.log(''hello'');
    }, 1000);

// clear interval after 4.5 seconds
setTimeout( _ => {
        clearInterval(myInterval);
    }, 4500);

Para ser descarado, si realmente necesitas usar setInterval , también puedes reemplazar el setInterval original. Por lo tanto, no se requiere ningún cambio de código al agregar esto antes de su código existente:

var setIntervalOrig = setInterval;

setInterval = function(func, interval) {
    func();
    return setIntervalOrig(func, interval);
}

Sin embargo, todas las ventajas enumeradas anteriormente se aplican aquí, pero no es necesaria ninguna sustitución.

Answer 7

No estoy seguro de si te estoy entendiendo correctamente, pero fácilmente podrías hacer algo como esto:

setInterval(function hello() {
  console.log(''world'');
  return hello;
}(), 5000);

Obviamente hay muchas formas de hacer esto, pero esa es la forma más concisa en la que puedo pensar.

Answer 8

Para resolver este problema, ejecuto la función por primera vez después de que la página se haya cargado.

function foo(){ ... }

window.onload = function() {
   foo();
};

window.setInterval(function()
{
    foo(); 
}, 5000);

Answer 9

Podría envolver setInterval() en una función que proporciona ese comportamiento:

function instantGratification( fn, delay ) {
    fn();
    setInterval( fn, delay );
}

... entonces úsalo así:

instantGratification( function() {
    console.log( ''invoked'' );
}, 3000);

Answer 10

Sugeriré llamar a las funciones en la siguiente secuencia

var _timer = setInterval(foo, delay, params);
foo(params)

También puede pasar el _timer al foo, si desea clearInterval(_timer) en una determinada condición

var _timer = setInterval(function() { foo(_timer, params) }, delay);
foo(_timer, params);

Answer 11

en realidad lo más rápido es hacer

interval = setInterval(myFunction(),45000)

esto llamará mi función, y luego lo hará de nuevo cada 45 segundos, lo que es diferente a hacerlo

interval = setInterval(myfunction, 45000)

que no lo llamará, sino que lo programará solo

Answer 12

// YCombinator
function anonymous(fnc) {
  return function() {
    fnc.apply(fnc, arguments);
    return fnc;
  }
}

// Invoking the first time:
setInterval(anonymous(function() {
  console.log("bar");
})(), 4000);

// Not invoking the first time:
setInterval(anonymous(function() {
  console.log("foo");
}), 4000);
// Or simple:
setInterval(function() {
  console.log("baz");
}, 4000);