ES6 中 let 和 const 变量的区别及使用方法

JavaScript 是一门动态类型语言，变量的使用在很多场景下都非常重要。在 ES6 中，引入了 let 和 const 关键字，作为 var 的替代品。本文将详细介绍 let 和 const 的区别和使用方法，并给出示例代码，帮助读者更好地理解。

let 变量

let 关键字用于声明一个块级作用域的变量。与 var 不同的是，let 变量只在声明的块中有效。例如：

function foo() {
  if (true) {
    let x = 10;
  }
  console.log(x); // 报错，x 未定义
}

在上面的代码中，如果使用 var 声明 x，那么在函数外部也可以访问到 x。但是使用 let 声明 x，则只在 if 块中有效，函数外部无法访问到 x。

另外，使用 let 声明的变量不会被提升。例如：

function foo() {
  console.log(x); // 报错，x 未定义
  let x = 10;
}

在上面的代码中，如果使用 var 声明 x，那么在函数内部可以访问到 x，但是 x 的值为 undefined。但是使用 let 声明 x，则会报错，因为 x 在声明之前被使用了。

const 变量

const 关键字用于声明一个块级作用域的常量。与 let 变量不同的是，const 变量声明后不可再次赋值。例如：

const x = 10;
x = 20; // 报错，x 不可再次赋值

在上面的代码中，如果使用 let 声明 x，那么 x 可以被重新赋值。但是使用 const 声明 x，则会报错。

需要注意的是，const 变量不可被重新赋值，但是可以修改其属性。例如：

const obj = { name: '张三' };
obj.name = '李四'; // 可以修改 obj 的属性

在上面的代码中，虽然 obj 被声明为常量，但是仍然可以修改 obj 的属性。

总结

let 和 const 关键字是 ES6 中引入的新特性，用于声明块级作用域的变量和常量。let 变量只在声明的块中有效，不会被提升；const 变量声明后不可再次赋值，但是可以修改其属性。在实际开发中，我们需要根据具体的需求选择使用 let 还是 const。

示例代码

// javascriptcn.com 代码示例
// let 变量示例
function foo() {
  if (true) {
    let x = 10;
  }
  console.log(x); // 报错，x 未定义
}

// const 变量示例
const x = 10;
x = 20; // 报错，x 不可再次赋值

// const 变量修改属性示例
const obj = { name: '张三' };
obj.name = '李四'; // 可以修改 obj 的属性

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/653b848e7d4982a6eb5db84f