JavaScript循环中var变量异步输出问题源于闭包捕获变量本身而非每次迭代值；解决方法包括：①用let声明（ES6+首选）；②IIFE传参创建独立作用域；③forEach替代for循环；箭头函数本身不解决该问题。
在 JavaScript 中，循环中直接使用 var 声明的变量配合异步操作（如 setTimeout、事件监听、Promise 回调等），常会遇到所有回调都输出最后一个索引的问题——这是由于变量提升和闭包捕获的是**变量本身**而非其**每次迭代的值**。解决的关键是让每次迭代拥有自己独立的作用域，从而“保存”当时的索引值。
用 let 声明索引（最简洁）
let 具有块级作用域，for 循环每次迭代都会为 let 变量创建一个新的绑定，因此每个回调自然捕获各自迭代时的值：
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100); // 输出：0, 1, 2
}
✅ 推荐首选，语义清晰、无额外函数开销、兼容现代环境（ES6+）。
用立即执行函数（IIFE）包裹 var
在 ES5 或需兼容老环境时，可手动创建新作用域，把当前 i 作为参数传入：
立即学习“Java免费学习笔记（深入）”；
- 将
i作为形参传入 IIFE，函数体内形成闭包，捕获该次调用的实参值 - 注意必须显式传参，不能只写
(function(){...})()，否则仍访问外部var i
for (var i = 0; i < 3; i++) {
(function(index) {
setTimeout(() => console.log(index), 100);
})(i); // 把当前 i 的值传进去
}
用 forEach 替代 for（天然闭包）
Array.prototype.forEach 的回调函数每次执行都是独立调用，参数 value 和 index 天然就是当次迭代的值，无需额外处理：
[0, 1, 2].forEach((item, index) => {
setTimeout(() => console.log(index), 100); // 输出：0, 1, 2
});
⚠️ 注意：仅适用于数组；若需遍历类数组或控制流程（如 break），不适用。
箭头函数本身不解决，闭包靠作用域
常见误解：以为“用箭头函数就能保存索引”。其实箭头函数只是语法糖，是否捕获正确值，取决于它定义时所处的**词法作用域**。下面写法依然出错：
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100); // ❌ 还是输出 3, 3, 3
}
因为箭头函数内部的 i 仍指向全局/函数作用域中的那个 var i，而循环结束时 i === 3。
核心不是“怎么写回调”，而是“怎么让回调访问到它该访问的那个 i”。本质是作用域与变量绑定时机的问题——let 每轮新建绑定，IIFE 手动传值，forEach 函数参数隔离，三者殊途同归。
