Javascript 动态解除绑定eventListeners(垃圾收集)

Javascript 动态解除绑定eventListeners(垃圾收集),javascript,garbage-collection,event-listener,Javascript,Garbage Collection,Event Listener,我有以下绑定eventListeners的代码: // this code is part of a larger object _boundEventsTracker: [], _$bindEvents: function(){ var self = this; this.actions.forEach(function(acs){ acs = acs.split(' '); var find = document.querySelector(a

我有以下绑定eventListeners的代码:

// this code is part of a larger object
_boundEventsTracker: [],
_$bindEvents: function(){
    var self = this;
    this.actions.forEach(function(acs){
        acs = acs.split(' ');
        var find = document.querySelector(acs[1]);
        if(find!=null){
            // make sure we only bind events once
            if(self._boundEventsTracker.indexOf(acs[1]) == -1){
                find.addEventListener(acs[0], function(e){
                    self.functions[acs[2]].call(self, e);
                });
                self._boundEventsTracker.push(acs[1]);
            }
        } else {
            /* could not bind
            this is usually because the element resides on a partial page */
        }
    });
    console.log("Events:");
    console.log(this._boundEventsTracker.length);
},
this.actions
可能如下所示,例如:

actions: [
    'click .settings toggleSidebar',
],
在hashchange上,我动态加载一个页面,然后调用
\u$bindEvents
方法(
\u$load
XMLHttpRequest
的基于承诺的包装器):

window.addEventListener('hashchange',函数(e){
self.$load(e).然后(函数(内容){
document.querySelector('.pageArea')。innerHTML=content;//
  • ,垃圾收集器将删除已从DOM中删除的节点的事件侦听器。某些旧版本的IE存在内存泄漏,但这不再是问题

  • 可能,但可能不是。这取决于您有多少侦听器、DOM结构的复杂性、事件委托等。不可能对该问题给出一般性的答案。如果有,这些问题将在UI中而不是在内存消耗中被注意到

  • 如果您正在开发AN,请考虑将事件委派到顶部,因为它们将比在每个HASHchange中绑定/重新绑定所有这些事件更为容易管理。 此外,使用这样的自定义事件抽象可能是未来同事或合作者需要了解的问题

    window.addEventListener('hashchange', function(e){
        self._$load(e).then(function(content){
             document.querySelector('.pageArea').innerHTML=content; // <- populate here
             self._$bindEvents();
        }});