为什么计数正确地增加

Question

考虑这个简单的例子：

var count = 0;
for (var i = 0; i < 4; i++ ) {
    setTimeout(function() {
      console.log(i, count++);
    }, i * 200);
}

这将输出以下内容：

4 0
4 1
4 2
4 3

我猜测i总是解析为4，因为setTimeout回调封闭了变量I，但我想不出同样的规则对于count为什么不适用。

var count = 0;
for (var i = 0; i < 4; i++ ) {
  setTimeout(function() {
    console.log(i, count++);
  }, i * 2000 );
}

- helpermethod

Answer 1

在你的 for循环中，变量i被递增，并最终以值4结束，这发生在任何超时处理程序运行之前。另一方面，变量count仅在超时处理程序内部递增。当第一个超时处理程序触发时，count仍然是0。

- Pointy

Answer 2

正如前面的人所说，这是因为循环在超时被激活之前就已经完成了。

解决这个问题的一种方法是将超时放在另一个函数中，并从循环内部传递i给它。这确保了对于每次迭代，函数都会传递正确的i。

这也是为什么count被设置为预期值；它位于循环范围之外。

for (var i = 0; i < 4; i++) {
    doSomething(i);
};
function doSomething(i) {
    setTimeout(function() {
        console.log(i);
    }, i * 2000);
};

- ndugger