JavaScript 中 let 和 const 的区别及 ES11 的解决方案

在 JavaScript 中，变量声明有三种方式：var、let 和 const。其中，var 是 ES5 中引入的，而 let 和 const 是 ES6 中新增的。在这三种变量声明方式中，let 和 const 在作用域和变量提升方面有着明显的区别。本文将为大家详细介绍 let 和 const 的区别，并介绍 ES11 中解决作用域和变量提升问题的解决方案。

let 和 const 的区别

作用域

在 JavaScript 中，作用域是指变量的可访问范围。var 声明的变量存在函数作用域，而 let 和 const 声明的变量存在块级作用域。

// javascriptcn.com 代码示例
function foo() {
  var x = 1;
  if (true) {
    var x = 2;
    console.log(x); // 2
  }
  console.log(x); // 2
}

function bar() {
  let y = 1;
  if (true) {
    let y = 2;
    console.log(y); // 2
  }
  console.log(y); // 1
}

foo();
bar();

在上面的代码中，foo 函数中使用 var 声明的变量 x 在 if 语句块中被重新赋值，导致在 if 语句块外部也是 2。而 bar 函数中使用 let 声明的变量 y 在 if 语句块中被重新赋值，但是在 if 语句块外部仍然是 1。

变量提升

在 JavaScript 中，变量提升是指变量可以在声明之前使用。var 声明的变量存在变量提升，而 let 和 const 声明的变量不存在变量提升。

// javascriptcn.com 代码示例
function foo() {
  console.log(x); // undefined
  var x = 1;
  console.log(x); // 1
}

function bar() {
  console.log(y); // ReferenceError: y is not defined
  let y = 1;
  console.log(y); // 1
}

foo();
bar();

在上面的代码中，foo 函数中使用 var 声明的变量 x 在声明前被使用，但是不会报错，输出 undefined。而 bar 函数中使用 let 声明的变量 y 在声明前被使用，会报错。

常量

const 声明的变量是一个常量，一旦赋值就不能被修改。而 let 和 var 声明的变量是可变的。

// javascriptcn.com 代码示例
const PI = 3.14;
PI = 3.14159; // TypeError: Assignment to constant variable.

let x = 1;
x = 2;
console.log(x); // 2

var y = 1;
y = 2;
console.log(y); // 2

在上面的代码中，常量 PI 被赋值后不能被修改，而 let 和 var 声明的变量可以被重新赋值。

ES11 的解决方案

在 ES11 中，新增了一个关键字：let、const 的块级作用域重定义 let、const。这个关键字可以解决 let 和 const 在作用域和变量提升方面的问题。

// javascriptcn.com 代码示例
function foo() {
  console.log(x); // ReferenceError: Cannot access 'x' before initialization
  {
    let x = 1;
    console.log(x); // 1
  }
  console.log(x); // ReferenceError: x is not defined
}

function bar() {
  console.log(y); // ReferenceError: Cannot access 'y' before initialization
  {
    const y = 1;
    console.log(y); // 1
  }
  console.log(y); // ReferenceError: y is not defined
}

foo();
bar();

在上面的代码中，使用块级作用域重定义 let 和 const，可以避免变量提升问题，让代码更加规范和易读。

总结

本文详细介绍了 JavaScript 中 let 和 const 的区别，包括作用域、变量提升和常量等方面，并介绍了 ES11 中解决作用域和变量提升问题的解决方案。在编写 JavaScript 代码时，建议使用 let 和 const 来声明变量，避免 var 声明的变量存在的问题。同时，在需要重新定义块级作用域的变量时，可以使用 ES11 中新增的关键字来解决问题。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65100f7195b1f8cacd8b40de