Question

当我遇到这个时，我正在阅读an article online：

// Sample 2
var funcs = [];

for(let x=0; x<3; x++) { 
  funcs.push(() => x); 
}

funcs.forEach(f => console.log(f()));
// Output: 0, 1, 2
// when using var instead of let in the for-loop: 3, 3, 3

有人可以解释为什么这有效吗？我原以为var ...

会发生同样的事情

我知道var和let之间的区别。我问的是为什么它不适用于var。

Answer 1

代码for (var x=...)声明一个值，其值发生变化，但对于每个创建的函数都会关闭。所有函数都引用相同的值及其最新更改。使用稍微旧的代码希望这更加明显：

var callbacks = [];
for (var i=0;i<5;++i) callbacks.push( function(){ console.log(i) } );
callbacks.forEach(function(func){ func() })
// Outputs "5" five times

代码for (let x=...)在每次循环运行时声明一个新变量，因此每个函数都会获得一个新变量（和相关值）。这在创建回调时非常方便，因此您不必执行以下旧方法：

    var callbacks = [];
    for (let i=0;i<5;++i){
      // Create an anonymous function and invoke it, passing in 'i'.
      // Each time the function is run a *new* variable named 'n'
      // is created and closed over by the function returned inside.
      var cb = (function(n){ return function(){ console.log(n) }})(i);
      callbacks.push(cb);
    }
    callbacks.forEach(function(func){ func() })
    // Outputs "0","1","2","3","4"

并且，为了证明，这里使用的是let：

    var callbacks = [];
    for (let i=0;i<5;++i) callbacks.push( function(){ console.log(i) } );
    callbacks.forEach(function(func){ func() })
    // Outputs "0","1","2","3","4"

Var vs let：这个JavaScript代码段是如何工作的？

1 个答案: