在 JavaScript 中的循环内创建函数时如何避免闭包问题？

循环内的 JavaScript 闭包 - 一个实际示例

在 JavaScript 中的循环内创建函数时，必须意识到闭包的可能性这些函数中使用的变量可能会被错误地绑定到相同的值。这可能会导致意外的行为，特别是在涉及延迟时。

问题陈述

考虑以下代码：

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

预期输出是：

<code>My value: 0
My value: 1
My value: 2</code>

但是，这段代码实际上输出：

<code>My value: 3
My value: 3
My value: 3</code>

出现这个问题是因为匿名函数中的变量i绑定到了循环外的同一个变量。因此，每个函数执行时，都会使用 i 的最终值。

ES6 解决方案： let

In ECMAScript 6 (ES6) ，let 关键字允许块范围变量。在循环中使用 let 每次迭代都会创建一个新变量，解决闭包问题。

<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">someArray.forEach(function(arrayElement) {
  // ... code for this one element
});</code>

回调函数的每次调用都将是其自己的闭包，确保传入的参数是特定的

经典解决方案：闭包

避免闭包问题的另一种方法是使用经典闭包，其中涉及将每个函数中的变量绑定到单独的、不变的值。

<code class="js">function createfunc(i) {
  return function() {
    console.log("My value: " + i);
  };
}</code>

以上是在 JavaScript 中的循环内创建函数时如何避免闭包问题？的详细内容。更多信息请关注PHP中文网其他相关文章！