javascript – 每隔x秒执行setTimeout和Ajax时内存泄漏

我使用jQuery Ajax和setTimeout()每隔x秒获取一次新数据,这会导致内存泄漏.浏览器内存在每次Ajax调用时都会上升,直到浏览器崩溃.

$(document).ready(wp.state.init);

wp.state = {

    data: {},init: function () {
        $.PubSub('state:refresh').subscribe(function () {
            window.setTimeout(function () {
                wp.state.refresh();
            },1000);
        });

        this.refresh();
    },refresh: function () {

        $.ajax({
            url: 'http://url_here/',cache: false,dataType: "json",success: function (data) {
                wp.state.data = data;
                $.PubSub('state:refresh').publish();
            }
        });
    }
}

更新(基于@dez答案)

wp.state = {

    data: {},init: function () {
        $.PubSub('state:refresh').subscribe(function () {
            window.setTimeout(wp.state.refresh,1000);
        });

        this.getState();
    },refresh: function () {
        wp.state.getState();
    },onSuccess: function (data) {
        wp.state.data = data;
        $.PubSub('state:refresh').publish();
    },getState: function () {

        $.ajax({
            url: 'http://url_here/',success: this.onSuccess
        });
    }
}

笔记：

>发布者/订阅者($.PubSub)从here开始执行.在实施PubSub之前也发生了Mem泄漏,因此它显然没有相关性.
>使用setTimeout而不是setInterval,只有在旧的Ajax调用成功后才能执行新的Ajax调用.
>当然还有其他函数可以监听’state：refresh’并使用wp.state.data中的数据

解决方法

我在这里可以看到一些问题,其中一些可能会导致内存泄漏.

对于初学者来说,第一行：

$(document).ready(wp.state.init);

这不会在正确的范围内执行init,因此该行的值将在行上未定义：

this.refresh();

你应该做这样的事情：

$(document).ready(function(){wp.state.init();});

或者将this.refresh()修改为显式wp.state.refresh().

我认为可能导致泄漏的是……

每次在刷新时进行$.ajax调用时,都会创建一个新函数来处理成功回调.您应该将回调定义为wp.state对象上的另一个函数,并将其作为成功传递,方法与将wp.state.init传递给当前的ready()方法的方式相同.

类似地,每次在订阅PubSub的函数中调用window.setTimeout时,您也会创建一个函数来处理该回调.你应该在这里做同样的事情并将其提取到wp.state上的函数中.