ES6 块级作用域绑定和变量提升机制详解

ES6 杂记（解构） ES6 中的块级作用域和变量提升机制是非常重要的概念。在函数作用域或者全局作用域中，通过 var 声明的变量，无论在哪里声明，都会被当做成在当前作用域或顶部声明，这就是函数提升（Hoisting）。这种机制可能会导致一些意外的结果。 块级作用域是指在函数内部或大括号之间的区域中声明的变量，这些变量只能在该作用域中访问，无法在外部访问。块级声明用于在制定块的作用域之外无法访问的变量。 let 声明是块级作用域中的一种声明方式，它对变量声明，不能变量提升。let 声明的变量只能在当前块级作用域中访问，无法在外部访问。例如： ``` if (true) { let age = 20 } console.log(age) // 报错 ``` 需要注意的是，let 声明禁止重复声明，例如： ``` var a = 0 let a = 1 // 报错 ``` 但是，如果在块级作用域中声明变量，那么不会报错，例如： ``` var a = 0 if (true) { let a = 1 // 不报错 } ``` 块级作用域不会提升，例如： ``` console.log(a) // 会报错（临时死区TemporalDeadZone） console.log(typeof a) // 会报错 let a = 1 console.log(a) // undefined 变量提升 ``` const 声明是块级作用域中的一种声明方式，它对常量的声明，同样也不会变量提升。const 声明的变量只能在当前块级作用域中访问，无法在外部访问。例如： ``` const a = 1 // 有效 const a // 无效 const a = 0 // 重复声明，报错 ``` 需要注意的是，const 声明对象时，不允许修改绑定，但允许修改值，例如： ``` const person = { age: 20 } person.age = 21 // 有效 ``` 在循环中，块级作用域可以解决变量提升的问题，例如： ``` var fns = [] for (var i = 0; i < 10; i++) { fns.push(function(i) { return function() { console.log(i); }; }(i)); } fns.forEach(function(fn) { fn(); // 输出 0 到 9 }); // 使用 let var fns = []; for (let i = 0; i < 10; i++) { fns.push(function() { console.log(i); }); } fns.forEach(function(fn) { fn(); // 输出 0 到 9 }); ``` 在全局作用域中，let 和 const 与 var 的另一个区别是它们在全局作用域中的行为。这意味着 var 很可能意外覆盖了已经存在的全局属性。 ES6 中的块级作用域和变量提升机制是非常重要的概念，需要开发者了解和掌握，以避免一些意外的结果。