web-dev-qa-db-ja.com

JavaScriptですべてのタイムアウト/間隔を表示しますか？

JavaScriptのタイムアウトと間隔を使用してページを更新するアプリケーションを作成しています。設定されている間隔の数を確認する方法はありますか？数百の間隔を設定して誤ってブラウザを強制終了しないようにしたいのです。

これも問題ですか？

javascripttimeoutsetinterval
78
Omar Kooheji

アクティブなタイマーを列挙する方法はないと思いますが、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を呼び出すとは限りませんが、これにより、少なくとも実行時に何が起こっているかを追跡する方法が得られます。

68
Paul Dixon

すべての間隔を表示するChrome DevTools拡張を作成しました。クリアされた間隔はグレー表示されています。

Timers Chrome Devtool extension

setInterval-sniffer

25
NVI

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);
};
10
crv

タイマーのカウントだけではなく、すべてのtimeridを配列に保存する実装があります。 active timersのみが表示されますが、受け入れられた回答はsetTimeout＆clearTimeoutへの呼び出しのみをカウントします。

(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が同じことを行うことを想定していますが、これらは同じですが、将来変更される可能性があります。
8
A1rPun

公開済み この正確な問題を解決するパッケージです。

_npm install time-events-manager
_

それにより、timeoutCollectionオブジェクト（およびjava_scriptのインターバル_intervalCollectionオブジェクト）を介してそれらを表示および管理できます。

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

4
Ziv polack

私はこのようなものが必要でしたが、これが私がまとめたものです：

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とその機能を記録し、そのステータス（アクティブ/非アクティブ）も追跡します。

0
akinuri