jquery - 如何正确解除 jQuery 小部件中 dom 元素的绑定(bind)？

Question

我在 JavaScript 中遇到了一些内存泄漏问题。

我正在使用Leak Memory 0.4.5 extension for Firefox它向我展示了那些仍然保留在内存中的 JavaScript 对象。

现在我不确定如何正确地从事件等中解除 dom-object 的绑定(bind)。

例如，我有一个名为“dropdownbox”的 jQuery 小部件。在 destroy 方法中，我做了所有必要的事情来取消绑定(bind)事件处理程序，例如:

this.box.find('.toggler').unbind();
this.box.remove();
this.box = null;

这3行是必须的，还是只能调用this.box.remove()？

直到今天，我从未从 DOM 元素中解除绑定(bind)或清除某些内容，因为我认为这并不重要。但我遇到了一个问题，在同一站点上开发 2 小时后，我的 Firefox 消耗了 1GB!

所以我在使用闭包等时读到了一些内存泄漏
这是我的第二个问题:我经常使用闭包，因为它们真的很酷而且很方便。
有人说你不应该对所有事情都使用闭包。例如，如果我们有以下代码:

function foo(param1, param2) {
  var local1, local2;
  $('a').click(function() {
    alert('YEAH');
  });
}

最好这样做:

funtion foo(param1, param2) {
      var local1, local2;
      $('a').click(clickEvent);
    }
function() {
  alert('YEAH');
}

还是我理解错了？

Answer 1

我知道这是一个老话题，但是您提到了闭包，但您提供的示例不是闭包。当函数返回内部函数时，就会“发生”闭包。人们可能会看这里，因为这个问题位于谷歌搜索结果“javascript内存泄漏解除绑定(bind)事件”的顶部，他们不应该得到错误的信息:)我知道这不是故意的。

请在这里查看精彩的闭包解释:How do JavaScript closures work?