Ausführen der Funktion setInterval ohne Verzögerung beim ersten Mal

Question

Es gibt eine Möglichkeit, die setInterval Methode von javascript, um die Methode sofort auszuführen, und wird dann mit dem Timer ausgeführt

Answer 1

Am einfachsten ist es, die Funktion beim ersten Mal direkt selbst aufzurufen:

foo();
setInterval(foo, delay);

Es gibt jedoch gute Gründe, dies zu vermeiden setInterval - insbesondere unter bestimmten Umständen eine ganze Reihe von setInterval Ereignisse können ohne Verzögerung unmittelbar nacheinander eintreffen. Ein weiterer Grund ist, dass Sie, wenn Sie die Schleife stoppen wollen, explizit die clearInterval was bedeutet, dass Sie sich das Handle merken müssen, das von der ursprünglichen setInterval anrufen.

Eine alternative Methode ist daher, dass foo bei nachfolgenden Aufrufen selbst auslösen, indem sie setTimeout stattdessen:

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

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

// start the cycle
foo();

Dies garantiert, dass es eine mindestens ein Intervall von delay zwischen den Anrufen. Es macht es auch einfacher, die Schleife bei Bedarf abzubrechen - Sie rufen einfach nicht setTimeout wenn Ihre Schleifenabbruchbedingung erreicht ist.

Noch besser ist es, wenn Sie das alles in ein Paket verpacken unmittelbar aufgerufener Funktionsausdruck die die Funktion erstellt, die sich dann selbst wieder wie oben aufruft und automatisch die Schleife startet:

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

die die Funktion definiert und den Zyklus in einem Durchgang startet.

Answer 2

Ich bin mir nicht sicher, ob ich Sie richtig verstehe, aber so etwas könnte man leicht machen:

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

Es gibt natürlich eine Vielzahl von Möglichkeiten, dies zu tun, aber das ist die prägnanteste Art, die mir einfällt.

Answer 3

Ich bin über diese Frage gestolpert, weil ich das gleiche Problem habe, aber keine der Antworten hilft, wenn Sie es brauchen sich genau verhalten wie setInterval() sondern mit dem ばかり Unterschied, dass die Funktion sofort zu Beginn aufgerufen wird.

Hier ist meine Lösung für dieses Problem:

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

Der Vorteil dieser Lösung:

• vorhandener Code mit setInterval kann durch Substitution leicht angepasst werden
• arbeitet im strengen Modus
• es funktioniert mit bestehenden benannten Funktionen und Abschlüssen
• können Sie trotzdem den Rückgabewert verwenden und ihn an clearInterval() später

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);

Um frech zu sein: Wenn Sie wirklich brauchen, um setInterval dann könnten Sie auch das Original ersetzen setInterval . Daher ist keine Änderung des Codes erforderlich, wenn Sie dies vor Ihrem bestehenden Code hinzufügen:

var setIntervalOrig = setInterval;

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

Alle oben genannten Vorteile gelten auch hier, aber es ist kein Ersatz erforderlich.

Answer 4

Sie könnten einpacken setInterval() in einer Funktion, die dieses Verhalten bietet:

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

...dann verwenden Sie es so:

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

Answer 5

Hier ist ein Wrapper, um es zu verschönern, wenn Sie es brauchen:

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

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

Wenn Sie das dritte Argument von setInterval auf true setzen, wird der Vorgang unmittelbar nach dem Aufruf von setInterval zum ersten Mal ausgeführt:

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

Oder lassen Sie das dritte Argument weg, dann wird das ursprüngliche Verhalten beibehalten:

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

Einige Browser unterstützen weitere Argumente für setInterval, die dieser Wrapper nicht berücksichtigt; ich denke, diese werden selten verwendet, aber denken Sie daran, wenn Sie sie brauchen.