Javascript 绑定在不使用时会占用内存吗？答案

【问题标题】：Do Javascript bindings take up memory while not in use?Javascript 绑定在不使用时会占用内存吗？
【发布时间】：2014-04-21 20:15:36
【问题描述】：

我有一个我已经建立的日历，点击日历上的一天，就会运行一个函数。您可以在日历上逐月查看，它会生成月份。由于日历上的每一天，无论是否显示，都使用所有“天”的类绑定到一个事件，我担心“绑定”的数量会增加到数千个。

//after a new month is generated, the days are rebound
TDs.off("mousedown");
TDs = $(".tableDay");
TDs.on("mousedown", TDmouseDown);

在我学习 C#/Monogame 的过程中，我了解了可以快速重复以更新游戏元素的函数。所以，我想知道javascript是否以相同的方式工作。 Javascript 引擎是否重复检查每个事件绑定以查看它是否已发生？所以像这样的结构：

function repeat60timesPerSecond(){
 if(element1isClicked){ //blah }
 if(element2isClicked){ //blah }
 if(element3isClicked){ //blah }
}

或者 Javascript 是否能够在事件发生时以某种方式实际触发函数？

简而言之：Javascript 绑定是否仅因现有而占用内存？

到目前为止我的（不确定的）研究：

我已经多次尝试自己回答这个问题。首先，我做了一个jsperf test. 除了在我的测试中存在明显的一致性问题之外，该测试实际上并没有测试这个问题。它主要测试解除绑定是否比解除绑定更快。而不是实际绑定在创建后占用多少内存。我想不出一种方法来使用这个测试服务来测试它。

然后我在谷歌上搜索了一下，发现了很多有趣的东西，但没有直接明确地回答这个问题。我确实遇到过this 的答案，它建议在类似情况下使用事件容器的单个事件绑定。

更新：

在发布这个之后，我想到了一种可能的方法来用本地 JS 测试这个：

function func(){
    console.log("test");
}
for(x=1;x<1000;x++){
    $('#parent').append("<div id='x"+x+"' class='child'></div>");
    $("#x"+x).on("mousedown", func);
}

console.time("timer");

for(i=1;i<1000000;i++){
    q = Math.sqrt(i);
    if(q % 1 == 0){
        q = 3;
    }
}

console.timeEnd("timer");

在玩过这个（改变 for 循环的作用，改变两个 for 循环的迭代次数等）之后，似乎事件绑定占用了非常少的内存。

【问题讨论】：

“Javascript 绑定是否仅因存在而占用内存？” 是的。 DOM 元素 -> 事件处理程序的每个关联都会占用一些内存。如果您多次创建相同的事件处理程序更是如此，因为您正在创建一个新的函数对象。你可能想看看事件委托：learn.jquery.com/events/event-delegation.

标签： javascript jquery events javascript-events event-handling

【解决方案1】：

是的，它们都占用内存，但不是很多。只有一个函数对象。每个元素都有一个指向该对象的指针，因此每个元素大概有 4 个字节。

正如 Felix King 建议的那样，您可以通过使用委托来减少这种情况，因为容器元素只有一个绑定。然而，内存的节省被时间开销的增加所抵消——每次事件在容器中的任何地方发生时都会调用处理程序，并且它必须测试目标是否与委托事件的选择器匹配。

【讨论】：