자바 스크립트에서 모든 시간 초과 / 간격을 보십니까?

JavaScript 시간 초과 및 간격을 사용하여 페이지를 업데이트하는 응용 프로그램을 작성 중입니다. 얼마나 많은 간격이 설정되어 있는지 확인하는 방법이 있습니까? 수백 개의 간격을 설정하여 실수로 브라우저를 종료하지 않도록하고 싶습니다.

이것이 문제일까요?

나는 활성 타이머를 열거 할 수있는 방법이라고 생각하지 않습니다,하지만 당신은 무시할 수 window.setTimeout및 window.clearTimeout일부 추적을 한 후 원본을 호출 자신의 구현으로 대체.

window.originalSetTimeout = window.setTimeout;
window.originalClearTimeout = window.clearTimeout;
window.activeTimers = 0;

window.setTimeout = function(func, delay) {
    window.activeTimers++;
    return window.originalSetTimeout(func, delay);
};

window.clearTimeout = function(timerID) {
    window.activeTimers--;
    window.originalClearTimeout(timerID);
};

물론 항상을 호출하는 clearTimeout것은 아니지만 최소한 런타임에 일어나는 일을 추적 할 수있는 방법을 제공합니다.

모든 간격을 표시하는 Chrome DevTools 확장 프로그램을 만들었습니다. 지워진 항목은 회색으로 표시됩니다.

setInterval-sniffer

Paul이 setTimeout만을 다루었 기 때문에 setInterval / clearInterval에 대한 카운터를 공유 할 것이라고 생각했습니다.

window.originalSetInterval = window.setInterval;
window.originalClearInterval = window.clearInterval;
window.activeIntervals = 0;
window.setInterval = function (func, delay)
{
    if(func && delay){
            window.activeIntervals++;
    }
    return window.originalSetInterval(func,delay);
};
window.clearInterval = function (intervalId)
{
    // JQuery sometimes hands in true which doesn't count
    if(intervalId !== true){
        window.activeIntervals--;
    }
    return window.originalClearInterval(intervalId);
};

타이머 수를 갖는 대신 모든 timerid를 배열에 저장하는 구현이 있습니다. 수락 된 응답은 & 로의 통화 만 계산하는 동안 활성 타이머 만 표시 합니다.setTimeoutclearTimeout

(function(w) {
    var oldST = w.setTimeout;
    var oldSI = w.setInterval;
    var oldCI = w.clearInterval;
    var timers = [];
    w.timers = timers;
    w.setTimeout = function(fn, delay) {
        var id = oldST(function() {
            fn && fn();
            removeTimer(id);
        }, delay);
        timers.push(id);
        return id;
    };
    w.setInterval = function(fn, delay) {
        var id = oldSI(fn, delay);
        timers.push(id);
        return id;
    };
    w.clearInterval = function(id) {
        oldCI(id);
        removeTimer(id);
    };
    w.clearTimeout = w.clearInterval;

    function removeTimer(id) {
        var index = timers.indexOf(id);
        if (index >= 0)
            timers.splice(index, 1);
    }
}(window));

다음은 페이지에서 활성 타이머 수를 얻는 방법입니다 .

timers.length;

다음은 모든 활성 타이머를 제거 하는 방법입니다 .

for(var i = timers.length; i--;)
    clearInterval(timers[i]);

알려진 제한 사항 :

• 함수 (문자열 아님) 만 전달할 수 있습니다. setTimeout이 원숭이 패치 사용 .
• 이 함수는 가정 clearInterval하고 clearTimeout동일한 작업을 수행하지만 나중에 변경 될 수 있습니다.

이 정확한 문제를 해결하는 패키지를 방금 게시 했습니다.

npm install time-events-manager

이를 통해 timeoutCollection개체 (및 개체 를 통한 자바 스크립트 간격)를 통해보고 관리 할 수 ​​있습니다 intervalCollection.

timeoutCollection.getScheduled(); timeoutCollection.getCompleted(); timeoutCollection.getAll();

나는 단지 이와 같은 것이 필요했고 이것이 내가 함께 모은 것입니다.

window.setInterval = function (window, setInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.active) {
    window.timers.intervals.active = {};
  }
  return function (func, interval) {
    var id = setInterval(func, interval);
    window.timers.intervals.active[id] = func;
    return id;
  }
}(window, window.setInterval);

window.clearInterval = function (window, clearInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.inactive) {
    window.timers.intervals.inactive = {};
  }
  return function (id) {
    if (window.timers.intervals.active && window.timers.intervals.active[id]) {
      window.timers.intervals.inactive[id] = window.timers.intervals.active[id];
      clearInterval(id);
      delete window.timers.intervals.active[id];
    }
  }
}(window, window.clearInterval);

이는 id기능과 함께 간격 s를 기록 하고 상태 ( active/ inactive) 를 추적 합니다.