Comment utiliser setInterval et 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;
    }
}

Salut à tous,

Je veux appeler drawAll()une fois sans créer de boucle qui appelle drawAllencore et encore, dois-je utiliser une méthode récursive pour cela ou dois-je utiliser clearInterval?

Veuillez également me dire d'utiliser clearInterval? Merci :)

Raj
la source

Réponses:

210

setIntervalmet en place une minuterie récurrente . Il renvoie une poignée dans laquelle vous pouvez passer clearIntervalpour l'empêcher de se déclencher:

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

Sur les navigateurs, le handle est garanti être un nombre qui n'est pas égal à 0; par conséquent, 0crée une valeur d'indicateur pratique pour "aucun réglage de minuterie". (D'autres plates-formes peuvent renvoyer d'autres valeurs; les fonctions de minuterie de NodeJS renvoient un objet, par exemple.)

Pour programmer une fonction pour qu'elle ne se déclenche qu'une seule fois, utilisez setTimeoutplutôt Il ne continuera pas à tirer. (Il renvoie également un handle que vous pouvez utiliser pour l'annuler via clearTimeoutavant qu'il ne se déclenche une fois, le cas échéant.)

setTimeout(drawAll, 20);
TJ Crowder
la source
29

clearInterval est une option:

var interval = setInterval(doStuff, 2000); // 2000 ms = start after 2sec 
function doStuff() {
  alert('this is a 2 second warning');
  clearInterval(interval);
}
Joshua - Pendo
la source
7
N'utilisez jamais de cordes avec setIntervalou setTimeout.
TJ Crowder
1
vous voulez dire que je devrais supprimer les guillemets entourant doStuff ()?
Joshua - Pendo
9
Oui, les guillemets et les parenthèses. Tout simplement: setInterval(doStuff);. Passer une chaîne à setIntervalest un appel implicite à eval. Il est préférable de passer la référence de fonction à la place.
TJ Crowder
1
Eh bien, le vote négatif est peut-être juste .. J'ai montré un exemple qui n'est pas correct (bien que cela fonctionne dans mes cas, mais je change ceux-ci au fur et à mesure). Pouces vers le haut! :)
Joshua - Pendo
10

Utilisez setTimeout(drawAll, 20)plutôt. Cela n'exécute la fonction qu'une seule fois.

dlev
la source
Merci beaucoup, mais setTimeout termine la boucle à chaque point, j'utilise une autre approche et cela fonctionne bien, function doKeyDown (event) {switch (event.keyCode) {case 32: / * La barre d'espace a été enfoncée * / loop = setInterval (drawAll, 20); si (x == 202) {x = 400; fileur(); } Pause; }}
Raj
ce n'était pas la question tho
Nino Škopac
8

J'ai utilisé angulaire avec électron,

Dans mon cas, setIntervalrenvoie un objet Nodejs Timer. qui quand je l'ai appelé clearInterval(timerobject)ne fonctionnait pas.

Je devais d'abord obtenir l'identifiant et appeler clearInterval

clearInterval(timerobject._id)

J'ai lutté pendant de nombreuses heures avec ça. J'espère que cela t'aides.

PJ3
la source
5

Note latérale - si vous souhaitez utiliser des fonctions séparées pour définir et effacer l'intervalle, la variable d'intervalle doit être accessible pour tous, dans une portée `` globale relative '' ou `` un niveau supérieur '':

var interval = null;    

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

function stopStuff() {
    clearInterval(interval);
}
HynekS
la source