Soweit ich das beurteilen kann, verhalten sich diese beiden Javascript-Teile gleich:
Option A:
function myTimeoutFunction()
{
doStuff();
setTimeout(myTimeoutFunction, 1000);
}
myTimeoutFunction();
Option B:
function myTimeoutFunction()
{
doStuff();
}
myTimeoutFunction();
setInterval(myTimeoutFunction, 1000);
Gibt es einen Unterschied zwischen der Verwendung von setTimeout und setInterval ?
javascript
setinterval
Damovisa
quelle
quelle
Antworten:
Sie versuchen im Wesentlichen, dasselbe zu tun, aber der
setInterval
Ansatz ist genauer als dersetTimeout
Ansatz, dasetTimeout
1000 ms gewartet, die Funktion ausgeführt und dann eine weitere Zeitüberschreitung festgelegt wird. Die Wartezeit beträgt also etwas mehr als 1000 ms (oder viel mehr, wenn die Ausführung Ihrer Funktion lange dauert).Obwohl man denken könnte,
setInterval
wird ausgeführt , genau alle 1000 ms, ist es wichtig zu beachten , dasssetInterval
auch verzögern, da JavaScript nicht eine Multi-Threaded - Sprache ist, was bedeutet , dass - wenn es andere Teile des Skripts ausgeführt wird - das Intervall hat darauf warten, dass das zu Ende ist.In dieser Geige können Sie deutlich sehen, dass das Zeitlimit zurückfällt, während das Intervall fast immer bei fast 1 Aufruf / Sekunde liegt (was das Skript versucht). Wenn Sie die Geschwindigkeitsvariable oben auf etwas Kleines wie 20 ändern (was bedeutet, dass versucht wird, 50 Mal pro Sekunde zu laufen), erreicht das Intervall nie ganz durchschnittlich 50 Iterationen pro Sekunde.
Die Verzögerung ist fast immer vernachlässigbar, aber wenn Sie etwas wirklich Genaues programmieren, sollten Sie sich für einen selbsteinstellenden Timer entscheiden (der im Wesentlichen ein Timeout-basierter Timer ist, der sich ständig an die Verzögerung anpasst, die er erzeugt).
quelle
Ja. Ein Timeout führt eine bestimmte Zeitspanne aus, nachdem setTimeout () aufgerufen wurde. Ein Intervall wird eine bestimmte Zeitspanne nach dem Auslösen des vorherigen Intervalls ausgeführt.
Sie werden den Unterschied bemerken, wenn die Ausführung Ihrer doStuff () -Funktion eine Weile dauert. Wenn wir beispielsweise einen Aufruf von setTimeout / setInterval mit
.
, ein Auslösen des Timeouts / Intervalls mit*
und die Ausführung von JavaScript-Code mit darstellen[-----]
, sehen die Zeitleisten wie folgt aus:Die nächste Komplikation besteht darin, dass ein Intervall ausgelöst wird, während JavaScript bereits beschäftigt ist (z. B. die Behandlung eines vorherigen Intervalls). In diesem Fall wird das Intervall gespeichert und erfolgt, sobald der vorherige Handler beendet ist und die Steuerung an den Browser zurückgibt. So zum Beispiel für einen doStuff () -Prozess, der manchmal kurz ([-]) und manchmal lang ([-----]) ist:
• stellt ein Intervallfeuer dar, das seinen Code nicht sofort ausführen konnte und stattdessen ausstehend gemacht wurde.
Intervalle versuchen also, aufzuholen, um wieder im Zeitplan zu sein. Sie stellen jedoch keine übereinander in die Warteschlange: Pro Intervall kann immer nur eine Ausführung anstehen. (Wenn sie alle in der Warteschlange stehen würden, würde der Browser eine ständig wachsende Liste ausstehender Ausführungen haben!)
x steht für ein Intervallfeuer, das nicht ausgeführt oder ausstehend gemacht werden konnte und stattdessen verworfen wurde.
Wenn die Ausführung Ihrer doStuff () -Funktion gewöhnlich länger dauert als das dafür festgelegte Intervall, verbraucht der Browser 100% der CPU, die versucht, sie zu warten, und reagiert möglicherweise weniger schnell.
Chained-Timeout bietet dem Browser eine garantierte freie Zeit. Intervall versucht sicherzustellen, dass die von ihm ausgeführte Funktion auf Kosten der Verfügbarkeit der Browser-Benutzeroberfläche so nahe wie möglich an den geplanten Zeiten ausgeführt wird.
Ich würde ein Intervall für einmalige Animationen in Betracht ziehen, das ich so flüssig wie möglich gestalten wollte, während verkettete Zeitüberschreitungen für laufende Animationen, die während des Ladens der Seite ständig stattfinden, höflicher sind. Für weniger anspruchsvolle Anwendungen (z. B. ein trivialer Updater, der alle 30 Sekunden ausgelöst wird oder so), können Sie beide sicher verwenden.
In Bezug auf die Browserkompatibilität ist setTimeout älter als setInterval, aber alle Browser, die Sie heute treffen, unterstützen beide. Der letzte Streuner seit vielen Jahren war IE Mobile in WinMo <6.5, aber hoffentlich liegt auch das jetzt hinter uns.
quelle
setInterval ()
setInterval()
ist eine zeitintervallbasierte Codeausführungsmethode, die die native Fähigkeit besitzt, ein angegebenes Skript wiederholt auszuführen, wenn das Intervall erreicht ist. Es sollte vom Skriptautor nicht in seine Rückruffunktion verschachtelt werden, damit es eine Schleife ausführt, da es standardmäßig eine Schleife ausführt . Es wird in der Pause weiter ausgelöst, es sei denn, Sie rufen anclearInterval()
.Wenn Sie Code für Animationen oder auf einem Uhr-Tick schleifen möchten, verwenden Sie
setInterval()
.setTimeout ()
setTimeout()
ist eine zeitbasierte Codeausführungsmethode, die ein Skript nur einmal ausführt, wenn das Intervall erreicht ist. Es wird nicht erneut wiederholt, es sei denn, Sie richten es so aus, dass es das Skript schleift, indem Sie dassetTimeout()
Objekt in die Funktion verschachteln, die es zum Ausführen aufruft. Wenn es auf Schleife eingestellt ist, wird es in der Pause weiter abgefeuert, es sei denn, Sie rufen anclearTimeout()
.Wenn Sie möchten, dass nach einem bestimmten Zeitraum einmal etwas passiert, verwenden Sie
setTimeout()
. Dies liegt daran, dass es nur einmal ausgeführt wird, wenn das angegebene Intervall erreicht ist.quelle
setTimeout()
Beispiel des OP rekursivsetTimeout()
aufgerufen wird , während dies nicht der Fall ist.setInterval()
Das setInterval erleichtert das Abbrechen der zukünftigen Ausführung Ihres Codes. Wenn Sie setTimeout verwenden, müssen Sie die Timer-ID verfolgen, falls Sie sie später abbrechen möchten.
gegen
quelle
setTimeout
ist, anstatt die ID zu speichern, eineif
Anweisung hinzuzufügen , um das nächste Zeitlimit nur festzulegen, wenn eine Bedingung erfüllt ist.doStuff
da die ID ungültig ist. Es ist jedoch nicht wirklich notwendig, Timeout-IDs zu speichern. Stattdessen können Sie einfach aufhören zu telefonierensetTimeout
.Ich finde die
setTimeout
Methode einfacher zu verwenden, wenn Sie das Timeout abbrechen möchten:Wenn in der Funktion etwas schief gehen würde, wird der Fehler beim ersten Mal nicht mehr wiederholt, anstatt den Fehler jede Sekunde zu wiederholen.
quelle
Der Unterschied liegt in ihren Zwecken.
So einfach ist das
Weitere Details finden Sie hier http://javascript.info/tutorial/settimeout-setinterval
quelle
setTimeout()
Beispiel des OP rekursivsetTimeout()
aufgerufen wird , während dies nicht der Fall ist.setInterval()
Wenn Sie eine Funktion in setInterval ausführen, die länger als das Timeout funktioniert, bleibt der Browser hängen.
- Zum Beispiel dauert doStuff () 1500 Sekunden. ausgeführt werden und Sie tun: setInterval (doStuff, 1000);
1) Führen Sie doStuff ( ) im Browser aus, was 1,5 Sekunden dauert. ermordet werden;
2) Nach ~ 1 Sekunde wird versucht, doStuff () erneut auszuführen . Das vorherige doStuff () wird jedoch weiterhin ausgeführt->, sodass der Browser diesen Lauf zur Warteschlange hinzufügt (um ausgeführt zu werden, nachdem der erste ausgeführt wurde).
3,4, ..) Das gleiche Hinzufügen zur Ausführungswarteschlange für die nächsten Iterationen, aber doStuff () von vorherigen sind noch in Bearbeitung ...
Infolgedessen bleibt der Browser hängen.
Um dieses Verhalten zu verhindern, führen Sie setTimeout am besten in setTimeout aus, um setInterval zu emulieren .
Um Zeitüberschreitungen zwischen setTimeout-Aufrufen zu korrigieren, können Sie eine selbstkorrigierende Alternative zur setInterval- Technik von JavaScript verwenden.
quelle
Ich benutze setTimeout.
Anscheinend besteht der Unterschied darin, dass setTimeout die Methode einmal aufruft, setInterval sie wiederholt aufruft.
Hier ist ein guter Artikel, der den Unterschied erklärt: Tutorial: JavaScript-Timer mit setTimeout und setInterval
quelle
Ihr Code hat unterschiedliche Ausführungsintervalle, und in einigen Projekten, z. B. bei Online-Spielen, ist dies nicht akzeptabel. Was sollten Sie zuerst tun, damit Ihr Code mit denselben Intervallen funktioniert? Ändern Sie "myTimeoutFunction" wie folgt:
Nach dieser Änderung ist es gleich
Sie haben jedoch immer noch kein stabiles Ergebnis, da JS Single-Threaded ist. Wenn der JS-Thread mit etwas beschäftigt ist, kann er Ihre Rückruffunktion vorerst nicht ausführen, und die Ausführung wird um 2-3 ms verschoben. Haben Sie 60 Ausführungen pro Sekunde und jedes Mal, wenn Sie eine zufällige Verzögerung von 1-3 Sekunden haben, ist dies absolut nicht akzeptabel (nach einer Minute beträgt die Verzögerung etwa 7200 ms), und ich kann Ihnen raten, so etwas zu verwenden:
Dieser Code garantiert eine stabile Ausführungsdauer. Sogar der Thread ist beschäftigt und Ihr Code wird nach 1005 ms ausgeführt. Beim nächsten Mal tritt eine Zeitüberschreitung von 995 ms auf, und das Ergebnis ist stabil.
quelle
Ich habe einen einfachen Test durchgeführt
setInterval(func, milisec)
, weil ich neugierig war, was passiert, wenn der Funktionszeitverbrauch größer als die Intervalldauer ist.setInterval
In der Regel wird die nächste Iteration unmittelbar nach dem Start der vorherigen Iteration geplant, es sei denn, die Funktion wird noch ausgeführt . Wenn ja,setInterval
warten Sie, bis die Funktion endet. Sobald dies geschieht, wird die Funktion sofort wieder ausgelöst - es wird nicht auf die nächste Iteration gemäß Zeitplan gewartet (wie dies unter Bedingungen ohne Zeitüberschreitung der Funktion der Fall wäre). Es gibt auch keine Situation, in der parallele Iterationen ausgeführt werden.Ich habe dies auf Chrome v23 getestet. Ich hoffe, es ist eine deterministische Implementierung in allen modernen Browsern.
Konsolenausgabe:
Die
wait
Funktion ist nur ein Thread-Blocking-Helfer - ein synchroner Ajax-Aufruf, der auf der Serverseite genau 2500 Millisekunden verarbeitet:quelle
setTimout
Aufruf wird bevorzugt.Um es etwas anders zu betrachten: setInterval stellt sicher, dass ein Code in jedem Intervall ausgeführt wird (dh 1000 ms oder wie viel Sie angeben), während setTimeout die Zeit festlegt, die es wartet, bis der Code ausgeführt wird. Da die Ausführung des Codes zusätzliche Millisekunden dauert, summiert sich der Wert auf 1000 ms, sodass setTimeout zu ungenauen Zeiten (über 1000 ms) erneut ausgeführt wird.
Zum Beispiel werden Timer / Countdowns nicht mit setTimeout ausgeführt, sondern mit setInterval, um sicherzustellen, dass es nicht verzögert wird und der Code im genau angegebenen Intervall ausgeführt wird.
quelle
Sowohl setInterval als auch setTimeout geben eine Timer-ID zurück, mit der Sie die Ausführung abbrechen können, dh bevor die Zeitüberschreitungen ausgelöst werden. Um abzubrechen, rufen Sie entweder clearInterval oder clearTimeout wie folgt auf:
Außerdem werden die Zeitüberschreitungen automatisch abgebrochen, wenn Sie die Seite verlassen oder das Browserfenster schließen.
quelle
Sie können die Bobince-Antwort selbst validieren, wenn Sie das folgende Javascript ausführen oder diese JSFiddle überprüfen
quelle
Nun, setTimeout ist in einer Situation besser, wie ich gerade gelernt habe. Ich benutze immer setInterval, das ich länger als eine halbe Stunde im Hintergrund laufen lassen muss. Als ich zu dieser Registerkarte zurückkehrte, änderte sich die Diashow (auf der der Code verwendet wurde) sehr schnell, anstatt alle 5 Sekunden, die sie haben sollte. Es passiert tatsächlich wieder, wenn ich es mehr teste und es nicht wichtig ist, ob es der Fehler des Browsers ist oder nicht, denn mit setTimeout ist diese Situation völlig unmöglich.
quelle
Der Unterschied ist in der Konsole offensichtlich:
quelle
Wenn Sie nur das hinzufügen, was bereits gesagt wurde, aber die setTimeout-Version des Codes auch das erreicht
Maximum call stack size
, wird es nicht mehr funktionieren. Da es keinen Basisfall gibt, bei dem die rekursive Funktion anhalten kann, kann sie nicht für immer ausgeführt werden.quelle
setTimeout () führt den Ausdruck nur EINMAL und nach dieser angegebenen Dauer aus.
Jedoch,
setInterval () führt den Ausdruck in der INFINITE-LOOP nach jeder angegebenen Dauer aus.
quelle
Ich denke
SetInterval
und binSetTimeout
anders.SetInterval
führt den Block gemäß der eingestellten Zeit aus, währendSetTimeout
der Codeblock einmal ausgeführt wird.Probieren Sie diese Codes nach den Countdown-Sekunden für das Timeout aus:
und dann versuchen
Sie können die Unterschiede selbst sehen.
quelle