在 JavaScript 编程中，经常会使用循环来遍历数组或对象。在 ES6 中，引入了新的变量声明方式 let 和块级作用域，与 var 和函数作用域相对应。这两种声明方式在循环中的使用有一些重要的差异，下面将详细介绍它们的使用技巧，并通过示例代码进行说明。
var 在循环中的问题
在 ES5 中，通常使用 var 来声明变量，例如：
for (var i = 0; i < array.length; i++) {
// ...
}然而，这种方式存在一些问题，主要是由于 var 声明变量时会将变量声明提升到函数作用域顶部。因此，在循环中使用 var 声明的变量时，容易出现这样的情况：
-- -------------------- ---- -------
--- ----- - ---
--- ---- - - -- - - -- ---- -
--------------------- -
---------------
---
-
----------- -- -- -
----------- -- -- -
----------- -- -- -在这个例子中，由于 i 是使用 var 声明的，在循环时会将 i 的值提升到函数作用域顶部，因此在执行 funcs0 时，输出的值是 3，而不是期望中的 0。
这个问题可以使用闭包来解决，将 i 的值保存在一个函数的作用域中：
-- -------------------- ---- -------
--- ----- - ---
--- ---- - - -- - - -- ---- -
----------------------- -
------ ---------- -
---------------
--
-------
-
----------- -- -- -
----------- -- -- -
----------- -- -- -在这个例子中，使用了立即执行函数来创建一个新的作用域，并将 i 的值作为参数进行传递。在循环中每次迭代都会创建一个新的作用域，因此保存的 i 的值是不同的。
这个解决方案比较繁琐，因为需要使用立即执行函数来创建新的作用域。在 ES6 中，引入了新的声明方式 let，可以更方便地解决这个问题。
let 的作用域
let 的作用域是块级作用域，即只在声明的块中有效。例如，在循环中使用 let 声明变量时，变量仅在循环中的块级作用域中有效：
for (let i = 0; i < 3; i++) {
setTimeout(function() {
console.log(i);
}, 1000 * (i + 1));
}
// 输出 0
// 输出 1
// 输出 2在这个例子中，使用 let 声明变量 i，每次迭代都会创建一个新的块级作用域，因此在 setTimeout 中访问的 i 的值是不同的。
let 和 const 的注意事项
使用 let 和 const 声明变量时，变量必须在声明之后才能使用。例如，在循环中使用 let 中的例子：
for (let i = 0; i < 3; i++) {
console.log(i);
let j = i * 2;
}在这个例子中，使用 let 声明了变量 j，在声明之前访问 j 的值会导致 ReferenceError。
另外，使用 const 声明变量时，变量的值不能被修改，否则会导致 TypeError。例如：
const a = 1; a = 2; // TypeError: Assignment to constant variable.
总结
在循环中使用 var 声明变量时，需要注意变量提升的问题，可能导致意外的结果。使用 let 和 const 声明变量时，需要注意作用域的问题，变量只在声明的块级作用域中有效。要避免在声明之前访问变量的值，同时使用 const 时需要注意变量不能被修改的问题。
尽可能地使用 let 和 const 声明变量，避免使用 var，可以避免部分潜在的问题，使代码更加健壮和可维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6468558c968c7c53b088edb2