Вызов clearInterval в консоли браузера в Chrome

Question

Я запускаю этот код JS в консоли браузера для отображения некоторых имен из таблицы с интервалом в 4 секунды. После того, как цикл запустится X раз, он должен очистить интервал.

$(document).ready(function() {
    for(var j = 0; j < 2; j++) {
        var refreshIntervalId = setInterval(function(){var td = $("tr td:first-child");
            for (var i = 6; i < 26; i++){
                console.log(td[i].innerText);
            }},4000);
        $("#idc4").click();
    }
    clearInterval(refreshIntervalId);
});

Я сохранил идентификатор интервала в переменной refreshIntervalId, и после цикла с этим идентификатором я вызываю функцию clearInterval, но мой интервал продолжает работать, отображая те же имена в консоли. Переменная вне контекста? Или у консоли браузера есть некоторые ограничения, когда дело доходит до этого?

Answer 1

Вам нужны ваши интервалы, чтобы остановить себя после того, как они были вызваны X раз.

Так что вам нужно немного изменить логику вашего кода. Потому что прямо сейчас ваш цикл for в сочетании с использованием var заменит ваш intervalId каждый раз, когда вы цикл

Я ввел объект intervalContext, который содержит intervalId и сколько раз это называлось. Привязывая его к интервалу, каждый интервал имеет свой собственный intervalContext.

// how many times will the interval be called :
var numberOfCalls = 3;

for (var j = 0; j < 2; j++) {
    // initiating a new intervalContext
    var intervalContext = {};    
    intervalContext.called = 0;
    // storing the intervalId in the intervalContext so the interval can clear itself 
    intervalContext.intervalId = setInterval((function() {
        // the intervalContext object will be referenced by 'this'
        this.called++;

        for (var i = 6; i < 26; i++) {
            console.log("looping i = " + i);
        }

        if (this.called > numberOfCalls) {
            console.log("Interval cleared. ID=", this.intervalId);
            clearInterval(this.intervalId);
        }
    }).bind(intervalContext), 1000); // binding the interval to the intervalContext
    console.log("Interval started. ID=" + intervalContext.intervalId);

}