-2

可能重复：
for循环和词法环境中的闭包

我正在学习 JavaScript 中的闭包...我看到了简单代码的示例：

for (var i = 0; i < 10; i++) {
  document.getElementById('box' + i).onclick = function() {
    alert('You clicked on box #' + i);
  };
}

但究竟发生了什么，无论div您选择什么，您都会收到关于最后一次迭代的警报i。

我看到了使用内部函数解决该问题的方法，但为什么会发生这种情况？它不是onclick在每次迭代时都绑定事件吗？

4

2 回答 2

1

每次迭代都会创建一个新函数，但每个函数都引用相同的变量i（内存中的一个位置）。的值i仅在执行处理程序时评估。那一刻是在for循环完成之后很长时间，并且在那个时候，i有 value 10。

维基百科关于闭包的文章值得一读，并提到了闭包的两种工作方式：绑定变量的当前值或对变量本身的引用。后者是 JavaScript 的情况。

于 2012-12-24T05:05:52.413 回答
0

好旧的同变量问题。i您可以通过将其传递给作为参数的自调用函数来轻松绕过它：

for(var i = 0; i < 10; i++) {
    (function(i) {
        document.getElementById('box' + i).onclick = function() {
            alert('You clicked on box #' + i);
        };
    })(i);
}

这是必要且有效的原因i是通常总是相同的 - JavaScript 只有一个函数范围。通过使用以参数为参数的自调用函数，i您每次都创建一个新函数，i然后将其保存在回调函数的闭包中。

于 2012-12-24T05:05:02.983 回答