Jak używać setInterval i 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;
    }
}

Cześć wszystkim,

Chcę zadzwonić drawAll()raz, nie tworząc pętli, która wywołuje drawAllwielokrotnie, czy powinienem użyć do tego metody rekurencyjnej, czy powinienem użyć clearInterval?

Również proszę, powiedz mi, aby użyć clearInterval? Dzięki :)

Raj
źródło

Odpowiedzi:

210

setIntervalustawia cykliczny zegar. Zwraca uchwyt, do którego można przejść, clearIntervalaby zatrzymać strzelanie:

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

W przeglądarkach uchwyt na pewno jest liczbą różną od 0; w związku z tym 0tworzy przydatną wartość flagi dla „no timer set”. (Inne platformy mogą zwracać inne wartości; na przykład funkcje licznika czasu NodeJS zwracają obiekt).

Aby zaplanować uruchamianie funkcji tylko raz, użyj setTimeoutzamiast tego. Nie będzie dalej strzelać. (Zwraca również uchwyt, którego możesz użyć do anulowania go, clearTimeoutzanim zostanie odpalony, jeśli to konieczne.)

setTimeout(drawAll, 20);
TJ Crowder
źródło
29

clearInterval to jedna z opcji:

var interval = setInterval(doStuff, 2000); // 2000 ms = start after 2sec 
function doStuff() {
  alert('this is a 2 second warning');
  clearInterval(interval);
}
Joshua - Pendo
źródło
7
Nigdy nie używaj ciągów z setIntervallub setTimeout.
TJ Crowder
1
masz na myśli, że powinienem usunąć cudzysłowy otaczające doStuff ()?
Joshua - Pendo
9
Tak, zarówno cytaty, jak i parens. Po prostu: setInterval(doStuff);. Przekazanie ciągu do setIntervaljest niejawnym wywołaniem eval. Zamiast tego najlepiej podać odwołanie do funkcji .
TJ Crowder
1
No cóż, może ten głos jest sprawiedliwy. Pokazałem przykład, który nie jest poprawny (chociaż w moich przypadkach działa, ale zmieniam to, jak mówimy). Kciuki w górę! :)
Joshua - Pendo
10

Użyj setTimeout(drawAll, 20)zamiast tego. To wykonuje funkcję tylko raz.

dlev
źródło
Wielkie dzięki, ale setTimeout kończy pętlę w każdym punkcie, używam innego podejścia i działa dobrze, funkcja doKeyDown (event) {przełącznik (event.keyCode) {przypadek 32: / * Naciśnięto spację * / loop = setInterval (drawAll, 20); if (x == 202) {x = 400; prządka(); } przerwa; }}
Raj
to jednak nie była kwestia
Nino Škopac
8

Użyłem kątowego z elektronem,

W moim przypadku setIntervalzwraca obiekt Nodejs Timer. które, kiedy zadzwoniłem clearInterval(timerobject), nie zadziałało.

Najpierw musiałem zdobyć identyfikator i zadzwonić do clearInterval

clearInterval(timerobject._id)

Zmagałem się z tym przez wiele godzin. mam nadzieję że to pomoże.

PJ3
źródło
5

Uwaga dodatkowa - jeśli chcesz używać oddzielnych funkcji do ustawiania i czyszczenia interwału, zmienna interwału musi być dostępna dla nich wszystkich, w zakresie „względnym globalnym” lub „jeden poziom wyżej”:

var interval = null;    

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

function stopStuff() {
    clearInterval(interval);
}
HynekS
źródło