Como usar setInterval e 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;
    }
}

Olá a todos,

Eu quero chamar drawAll()uma vez não criando um loop que chame drawAllrepetidamente, devo usar o método recursivo para isso ou devo usar clearInterval?

Também me diga para usar clearInterval? Obrigado :)

javascript jquery

— Raj
fonte

210

setIntervalconfigura um cronômetro recorrente . Ele retorna um identificador no qual você pode passar clearIntervalpara impedir o disparo:

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

Nos navegadores, o identificador é garantido como um número que não é igual a 0; portanto, 0cria um valor de sinalizador útil para "nenhum timer definido". (Outras plataformas podem retornar outros valores; as funções de timer do NodeJS retornam um objeto, por exemplo.)

Para agendar uma função para disparar apenas uma vez, use em seu setTimeoutlugar. Não vai continuar disparando. (Ele também retorna um identificador que você pode usar para cancelá-lo clearTimeoutantes de dispará-lo uma vez, se apropriado.)

setTimeout(drawAll, 20);

— TJ Crowder
fonte

29

clearInterval é uma opção:

var interval = setInterval(doStuff, 2000); // 2000 ms = start after 2sec 
function doStuff() {
  alert('this is a 2 second warning');
  clearInterval(interval);
}

— Josué - Pendo
fonte

7

Nunca use strings com setIntervalou setTimeout.

— TJ Crowder

1

quer dizer que eu deveria remover as aspas que cercam doStuff ()?

— Joshua - Pendo

9

Sim, as aspas e os parênteses. Simplesmente: setInterval(doStuff);. Passar uma string para setIntervalé uma chamada implícita para eval. Melhor passar a referência da função .

— TJ Crowder

1

Ah, bem, o voto negativo talvez seja justo .. Eu mostrei um exemplo que não está correto (embora funcione nos meus casos, mas estou mudando estes enquanto falamos). Afirmativo! :)

— Joshua - Pendo

10

Use em setTimeout(drawAll, 20)vez disso. Isso apenas executa a função uma vez.

— dlev
fonte

Muito obrigado, mas setTimeout está finalizando o loop em cada ponto, eu uso outra abordagem e está funcionando bem, função doKeyDown (event) {switch (event.keyCode) {case 32: / * Barra de espaço foi pressionada * / loop = setInterval (drawAll, 20); if (x == 202) {x = 400; spinner (); } pausa; }}

— Raj

não era a pergunta tho

— Nino Škopac

8

Eu usei angular com elétron,

No meu caso, setIntervalretorna um objeto Nodejs Timer. que quando liguei clearInterval(timerobject)não funcionou.

Eu tive que pegar o id primeiro e ligar para clearInterval

clearInterval(timerobject._id)

Eu lutei muitas horas com isso. espero que isto ajude.

— PJ3
fonte

5

Nota lateral - se você quiser usar funções separadas para definir e limpar o intervalo, a variável de intervalo deverá estar acessível para todas elas, no escopo 'global global' ou 'um nível acima':

var interval = null;    

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

function stopStuff() {
    clearInterval(interval);
}

— HynekS
fonte