Wie benutze ich setInterval und clearInterval?

138
function doKeyDown(event) {
    switch (event.keyCode) {
    case 32:
        /* Space bar was pressed */
        if (x == 4) {
            setInterval(drawAll, 20);
        }
        else {
            setInterval(drawAll, 20);
            x += dx;
        }
        break;
    }
}

Hallo zusammen,

Ich möchte drawAll()einmal aufrufen und keine Schleife erstellen , die drawAllimmer wieder aufruft. Soll ich dafür eine rekursive Methode verwenden oder sollte ich verwenden clearInterval?

Bitte sag mir auch zu benutzen clearInterval? Vielen Dank :)

Raj
quelle

Antworten:

210

setIntervalrichtet einen wiederkehrenden Timer ein. Es gibt einen Griff zurück, in den Sie gehen können clearInterval, um das Auslösen zu verhindern:

var handle = setInterval(drawAll, 20);

// When you want to cancel it:
clearInterval(handle);
handle = 0; // I just do this so I know I've cleared the interval

In Browsern ist das Handle garantiert eine Zahl, die nicht gleich ist 0. 0macht daher einen praktischen Flag-Wert für "kein Timer gesetzt". (Andere Plattformen geben möglicherweise andere Werte zurück. Die Timer-Funktionen von NodeJS geben beispielsweise ein Objekt zurück.)

Verwenden Sie stattdessen , um eine Funktion so zu planen, dass sie nur einmal setTimeoutausgelöst wird. Es wird nicht weiter schießen. (Es gibt auch ein Handle zurück, mit dem Sie es abbrechen können, clearTimeoutbevor es gegebenenfalls einmal ausgelöst wird.)

setTimeout(drawAll, 20);
TJ Crowder
quelle
29

clearInterval ist eine Option:

var interval = setInterval(doStuff, 2000); // 2000 ms = start after 2sec 
function doStuff() {
  alert('this is a 2 second warning');
  clearInterval(interval);
}
Joshua - Pendo
quelle
7
Verwenden Sie niemals Saiten mit setIntervaloder setTimeout.
TJ Crowder
1
du meinst ich sollte die Anführungszeichen um doStuff () entfernen?
Joshua - Pendo
9
Ja, sowohl die Zitate als auch die Parens. Einfach : setInterval(doStuff);. Das Übergeben eines Strings an setIntervalist ein impliziter Aufruf von eval. Übergeben Sie stattdessen am besten die Funktionsreferenz .
TJ Crowder
1
Na ja, die Abwertung ist vielleicht fair. Ich habe ein Beispiel gezeigt, das nicht korrekt ist (obwohl es in meinen Fällen funktioniert, aber ich ändere diese, während wir sprechen). Daumen hoch! :)
Joshua - Pendo
10

Verwenden Sie setTimeout(drawAll, 20)stattdessen. Das führt die Funktion nur einmal aus.

dlev
quelle
Vielen Dank, aber setTimeout beendet die Schleife an jedem Punkt. Ich verwende einen anderen Ansatz und seine Funktion funktioniert einwandfrei. Funktion doKeyDown (Ereignis) {switch (event.keyCode) {case 32: / * Leertaste wurde gedrückt * / loop = setInterval (drawAll, 20); if (x == 202) {x = 400; Spinner(); } brechen; }}
Raj
es war nicht die Frage tho
Nino Škopac
7

Ich habe Winkel mit Elektron verwendet,

In meinem Fall wird setIntervalein Nodejs Timer-Objekt zurückgegeben. was, als ich anrief clearInterval(timerobject), nicht funktionierte.

Ich musste zuerst die ID abrufen und clearInterval anrufen

clearInterval(timerobject._id)

Ich habe viele Stunden damit gekämpft. hoffe das hilft.

PJ3
quelle
5

Randnotiz - Wenn Sie separate Funktionen zum Festlegen und Löschen von Intervallen verwenden möchten, muss die Intervallvariable für alle zugänglich sein, und zwar im Bereich "relativ global" oder "eine Ebene höher":

var interval = null;    

function startStuff(func, time) {
    interval = setInterval(func, time);
}

function stopStuff() {
    clearInterval(interval);
}
HynekS
quelle