Як використовувати setInterval та 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;
    }
}

Привіт всім,

Я хочу зателефонувати drawAll()один раз, не створюючи цикл, який дзвонить drawAllзнову і знову, чи слід використовувати для цього рекурсивний метод чи повинен я використовуватиclearInterval ?

Також скажіть, будь ласка, скористатися clearInterval? Дякую :)

Відповіді:


210

setIntervalвстановлює повторюваний таймер. Він повертає ручку, в яку ви можете перейти, clearIntervalщоб запобігти її стрільбі:

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

У браузерах гарантовано, що ручка буде числом, яке не дорівнює 0; тому 0робить зручне значення прапора для "не встановлено таймер". (Інші платформи можуть повертати інші значення; наприклад, функції таймера NodeJS повертають об'єкт, наприклад.)

Щоб запланувати функцію лише одного разу, використовуйте setTimeoutзамість цього. Це не продовжує стріляти. (Він також повертає ручку, яку ви можете використовувати для її скасування до того, clearTimeoutяк вона запустить її одноразово, якщо це необхідно.)

setTimeout(drawAll, 20);

29

clearInterval - це один із варіантів:

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

7
Ніколи не використовуйте рядки з setIntervalабо setTimeout.
TJ Crowder

1
ти маєш на увазі, що я повинен видалити цитати навколо doStuff ()?
Джошуа - Пендо

9
Так, і цитати, і парени. Просто: setInterval(doStuff);. Передавання рядка в setInterval- це неявний виклик eval. Найкраще замість цього передати посилання на функцію .
TJ Crowder

1
Ну добре, що, можливо, справедливий результат. Я показав невірний приклад (хоча він працює і в моїх випадках, але я змінюю їх, як ми говоримо). Пальці вгору! :)
Джошуа - Пендо

10

Використовуйте setTimeout(drawAll, 20)замість цього. Це виконує функцію лише один раз.


Велике спасибі, але setTimeout закінчує цикл у кожній точці, я використовую інший підхід і його добре працює, функція doKeyDown (подія) {перемикач (event.keyCode) {випадок 32: / * Панель пробілу була натиснута * / loop = setInterval (drawAll, 20); якщо (x == 202) {x = 400; прядильник (); } перерва; }}
Радж

це був не питання Тхо
Ніно Škopac

8

Я використовував кутовий з електроном,

У моєму випадку setIntervalповертає об'єкт таймера Nodejs. який, коли я подзвонивclearInterval(timerobject) , не спрацювала.

Я повинен був отримати ідентифікатор першим і зателефонувати до clearInterval

clearInterval(timerobject._id)

Я багато годин боровся з цим. сподіваюся, що це допомагає.


5

Бічна примітка - якщо ви хочете використовувати окремі функції для встановлення та очищення інтервалу, змінна інтервал повинна бути доступною для всіх із них, у межах "відносного глобального" або "на один рівень вгору":

var interval = null;    

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

function stopStuff() {
    clearInterval(interval);
}
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.