带有 let 变量的 Javascript 闭包答案

【问题标题】：Javascript closures with let variable带有 let 变量的 Javascript 闭包
【发布时间】：2021-10-16 09:19:51
【问题描述】：

为什么 javascript 闭包在这些示例中的工作方式不同？

for (let i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log(i)
  }, 1000);
}
// Output: 0, 1, 2

let i = 0;
for (i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log(i)
  }, 1000);
}
// Output: 3, 3, 3

【问题讨论】：

这可能是被问到最多的javascript面试问题

标签： javascript closures

【解决方案1】：

在第一个代码示例中，您有三个不同的 i 变量，并且在循环的每次迭代中，setTimeout 的回调函数关闭一个不同副本i 变量。

在第二个代码示例中，只有一个 i 变量，并且在循环的每次迭代中，setTimeout 的回调函数都关闭了 same @ 987654326@变量。

第二个代码示例中只有一个i 变量，因为您已在循环外声明了它；因此，循环的每次迭代都会看到 same 变量 i。

为了在第二个代码示例中获得相同的输出，如下所示进行更改：

let i = 0;

for (i = 0; i < 3; i++) {

  let j = i; // save a copy of the current value of 'i'
  
  setTimeout(() => {
    console.log(j);  // closure over a different 'j' variable in each iteration
  }, 1000);
}

【讨论】：