在 JavaScript 循环中使用闭包时，如何确保每个闭包捕获正确的值？

JavaScript 循环中的闭包：一个实际示例

在 JavaScript 中，在循环中使用闭包时会出现一个常见问题，其中 a 的值闭包捕获的变量不是预期值。

问题：

使用 var 关键字在循环内定义函数时，所有函数在循环外部引用相同的变量环形。这可能会导致意外结果，如下面的代码所示：

<code class="js">var funcs = [];
for (var i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
}</code>

运行此代码会打印“My value: 3”三次，即使我们期望它从 0 增加到 2。

解决方案：

ES6 解决方案：Let

在 ECMAScript 6 (ES6) 中，let 关键字引入了变量的块作用域，这解决了这个问题。使用let，循环的每次迭代都会创建一个新变量i，其范围仅限于循环：

<code class="js">for (let i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
}</code>

ES5.1解决方案：forEach

在环境中支持 Array.prototype.forEach 函数，我们可以利用其独特的性质为每次迭代创建不同的闭包。回调函数接收数组的当前元素作为参数，确保每个函数捕获唯一的值：

<code class="js">var funcs = [];
[0, 1, 2].forEach(function(i) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
});</code>

经典解决方案：闭包

经典解决方案是创建一个闭包，将变量绑定到循环外的特定值。这是通过返回一个捕获所需值的新函数来实现的：

<code class="js">for (var i = 0; i < 3; i++) {
  funcs[i] = (function(i) {
    return function() {
      console.log("My value:", i);
    };
  })(i);
}</code>

通过将 i 作为参数传递给内部函数，我们确保每个闭包捕获正确的值。

以上是在 JavaScript 循环中使用闭包时，如何确保每个闭包捕获正确的值？的详细内容。更多信息请关注PHP中文网其他相关文章！