info@a-coding-project.de

JavaScript setInterval – Ausführung nach festen Zeitintervallen

Mit setInterval – einer Funktion des globalen window Objekts – kann die wiederholte Code-Ausführung nach einem bestimmten Zeitintervall erreicht werden. Dazu wird der Funktion als erster Parameter der auszuführende Code als Funktion übergeben. Der zweite Parameter gibt die Zeit in Millisekunden an, die vor jeder Code-Ausführung gewartet werden soll.

function meineFunktion() { 
    // ... 
} 

setInterval(function() { 
    // alle 3 Sekunden ausführen 
    meineFunktion(); 
}, 3000);

Für Intervalle gibt es eine Reihe ganz verschiedener Anwendungsfälle. Zum Beispiel könnte man sie nutzen, um in regelmäßigen Zeitabständen HTTP-Anfragen an einen Server zu schicken, um die Inhalte einer Webseite mit neuen Daten zu aktualisieren.

Mit clearInterval lässt sich ein Intervall beenden, vorausgesetzt eine Referenz darauf wurde vorher in einer Variablen gespeichert.

var meinIntervall = setInterval(function() { 
    // alle 3 Sekunden ausführen 
    update(); 
}, 3000); 

// Intervall beenden 
clearInterval(meinIntervall);

Auf den ersten Blick würde sich setInterval auch anbieten, um Schleifen/Loops für Animationen zu realisieren. Dies kann jedoch relativ stark rechenintensiv sein, weshalb in vielen Fällen andere, performantere Mittel genutzt werden sollten. Für Animationen auf einem HTML5 canvas-Element beispielsweise eignet sich die Funktion requestAnimationFrame viel besser. Sollen DOM-Elemente animiert werden, kann auf CSS3 Transitions zurückgegriffen werden.

Die Funktion setInterval ist weitgehend identisch mit der setTimeout Funktion mit dem Unterschied, dass bei setTimeout der Code nur einmalig ausgeführt wird. Beide Funktionen verhalten sich asynchron, was im Wesentlichen bedeutet, dass die weitere Programmausführung nicht von ihnen blockiert wird.

Auch bei der serverseitigen Programmierung mit Node.js lassen sich die setInterval und setTimeout Funktionen nutzen und das obwohl das window Objekt hier nicht zur Verfügung steht.

Über uns

Stefan Wienströer

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project

Auch interessant