洞察JS ES6变量声明:let & const 助阵区块级作用域

2023-12-07 22:38:54

一、洞悉 JavaScript 中的块级作用域

JavaScript 一直以来缺乏块级作用域，这意味着变量在函数或块中声明后，在整个函数或块中都有效。这可能导致变量冲突和意外的行为。ES6 中引入的 let 和 const 解决了这一问题，它们带来了块级作用域，允许在块中声明变量，并且只在该块中有效。

二、熟知 let 和 const 的妙用

1、let：可变且限定

let 声明的变量可以在块内重新赋值，但不能在块外访问。这使得 let 非常适合在循环或条件语句等块中声明临时变量。

2、const：恒定且限定

const 声明的变量是常量，不能重新赋值。这使得 const 非常适合声明不会改变的值，例如数学常量或对象属性。

三、理解暂时性死区

let 和 const 变量声明都存在暂时性死区，这意味着在变量声明之前使用该变量会报错。暂时性死区从变量声明开始，一直持续到变量被初始化。

四、全面认识 globalThis

globalThis 是 JavaScript 中的顶级对象。在浏览器中，globalThis 等同于 window 对象。在 Node.js 和 Web Worker 中，globalThis 分别等同于 global 对象和 self 对象。

五、代码实例领略概念

// 块级作用域示例
{
  let x = 10;
  const y = 20;

  console.log(x); // 10
  console.log(y); // 20
}

// console.log(x); // ReferenceError: x is not defined
// console.log(y); // ReferenceError: y is not defined

// 暂时性死区示例
console.log(z); // ReferenceError: z is not defined

let z = 10;

console.log(z); // 10

// globalThis 示例
console.log(globalThis === window); // true (in browser)
console.log(globalThis === global); // true (in Node.js)
console.log(globalThis === self); // true (in Web Worker)