在 Javascript 中，闭包是一个非常强大且常见的概念。它可以帮助我们在函数内部访问到函数外部的变量，并且可以保持这些变量的状态。但是，在使用闭包时需要特别注意在循环中访问外部变量的问题。
循环中的闭包问题
在循环中创建闭包时，我们通常会犯一个常见的错误：循环变量无法正确地传递到闭包中。具体来说，在循环中创建闭包时，由于 JavaScript 的作用域链，闭包只能访问最后一个循环变量的值。如下所示：
--- ---- - - -- - -- -- ---- -
--------------------- -
---------------
-- ------
-在上面的代码中，我们希望每隔一秒钟输出 1 到 5 的数字。然而，当我们运行这个代码时，我们会发现它输出了五个数字 6。这是因为闭包只能访问最后一个循环变量的值，而在 for 循环结束后，变量 i 的值为 6。
解决方法
要解决这个问题，我们可以使用立即执行函数表达式（Immediately Invoked Function Expression，IIFE）。这个技巧可以创建一个新的作用域，并将循环变量作为参数传递给闭包。由于函数调用时会创建一个新的作用域，因此每个循环迭代都会有一个独立的作用域和闭包。
--- ---- - - -- - -- -- ---- -
------------ -
--------------------- -
---------------
-- ------
------
-在上面的代码中，我们通过将立即执行函数表达式放在 setTimeout 函数内部来创建一个新的作用域和闭包，并将循环变量 i 作为参数 j 传递给闭包。这样，每次循环迭代时，我们都会创建一个新的闭包，可以正确地访问循环变量的值。
示例代码
下面是一个完整的示例代码，演示了如何使用 IIFE 来解决在循环中访问外部变量的问题：
--------- -----
------
------
------------- ------- -------- -- ---- ---- ---------- ---------------
----- ----------------
-------
------
------- -------------- ------------
--------
--- --- - -------------------------------
--- ---- - - -- - -- -- ---- -
------------ -
----------------------------- ---------- -
---------------
---
------
-
---------
-------
-------在这个示例中，当我们点击按钮后，控制台将依次输出 1 到 5 的数字。这是因为每个闭包都可以正确地访问循环变量的值。
总结
在循环中使用闭包时，需要注意如何正确地传递循环变量。通过使用立即执行函数表达式，我们可以创建一个新的作用域和闭包，从而解决在循环中访问外部变量的问题。掌握这个技巧可以帮助我们更好地理解 JavaScript 中的作用域和闭包，并避免常见的错误。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/28193