在 JavaScript 中,使用循环创建记录其索引或值的函数时会出现一个常见问题。尽管打算记录不同的值,但由于变量作用域的性质,所有函数最终通常都会记录相同的值。
考虑以下代码:
<code class="javascript">var funcs = []; for (var i = 0; i < 3; i++) { funcs[i] = function() { console.log("My value:", i); }; } for (var j = 0; j < 3; j++) { funcs[j](); // Outputs: "My value: 3" three times }</code>
它不是输出“我的值:0”、“我的值:1”和“我的值:2”,而是记录“我的值:3”三次。此行为在不同场景中持续存在,包括使用事件侦听器或异步代码。
ES6 引入了 let
关键字,该关键字创建作用域为其封闭块的变量。在循环中使用 let
可确保每个函数都有自己不同的变量:
<code class="javascript">for (let i = 0; i < 3; i++) { funcs[i] = function() { console.log("My value:", i); }; }</code>
对于涉及迭代数组的场景,forEach
方法提供了一种方便的解决方案。 forEach
循环中的每个回调都有自己的闭包,为每次迭代提供唯一的变量:
<code class="javascript">someArray.forEach(function(arrayElement) { console.log("My value:", arrayElement); });</code>
在较旧的 JavaScript 版本中,可以使用闭包将变量绑定到函数中的特定值:
<code class="javascript">var funcs = []; function createfunc(i) { return function() { console.log("My value:", i); }; } for (var i = 0; i < 3; i++) { funcs[i] = createfunc(i); }</code>
以上是循环内的 JavaScript 闭包会破坏变量作用域吗?的详细内容。更多信息请关注PHP中文网其他相关文章!