javascript：在块中本地化变量

我试图理解Javascript中的变量范围。以下是我正在做的：

<script>
for (var i = 0; i < 3; i++) {
  document.getElementById(i).onclick = function() {
    console.log(i);
  }
}
</script>

---

但是看起来，

i

没有被本地化。不知道为什么

在Javascript中，作用域不是由括号创建的（与类C语法相反）。但是，作用域是在函数中创建的，因此一种方法是将调用提取到函数中（已更新））：

对于（变量i=0；i<3；i++）{
日志调用（i）；
}
函数日志调用（i）{
document.getElementById（i）.onclick=function（）{
控制台日志（i）；
}
}

这样做的另一个好处是使代码更加可重用。

创建一个新的作用域

for (var i = 0; i < 3; i++) {
  (function(i) {
    document.getElementById(i).onclick = function() {
      console.log(i);
    }
  }(i));
}

for（变量i=0；i<3；i++）{
（职能（一）{
document.getElementById（i）.onclick=function（）{
控制台日志（i）；
}
}（i） ）；
}

我没有投反对票，但你的代码不能解决任何问题。这是不正确的，这不起作用。单击处理程序中的

i

仍然与以前相同

console.log

也是一个函数，因此根据您的逻辑，它最初也应该工作。呸，是的，对不起，我键入了一个较长的解释，但没有注意到我没有提取足够的逻辑。现在应该可以工作了。也感谢您的解决方案，@grailsgy它与onclick事件有关吗？如果用户只单击一次，它怎么能循环通过onclick呢？您需要logCall（）函数吗？这难道不是和console.log（i）一样吗？关于编辑，这和第一个示例中的问题是一样的。事件处理程序中是否有

console.log（i）

或

superlongandconfusingfunctionname（i）

，没有区别。循环终止后，您正试图访问

i

。

<script>
for (var i = 0; i < 3; i++) {
    logCall(i);
}

function logCall(i) {
    document.getElementById(i).onclick = function() {
        console.log(i);
    }
}
</script>

for (var i = 0; i < 3; i++) {
  (function(i) {
    document.getElementById(i).onclick = function() {
      console.log(i);
    }
  }(i));
}