解读 ES6 中的 let 和 const 与 var 的区别-JavaScript中文网-JavaScript教程资源分享门户

简介

ES6 (ECMAScript 2015) 引入了两个新的变量声明方式：let 和 const。let 和 const 除了具有作用域链上下文、闭包等基本概念外，还引入了块级作用域的概念。与 var 相比，let 和 const 更加安全、稳定、语义化。在实际使用时，需要了解他们的各自特点并根据具体情况选择使用。

let

let 关键字用于声明一个块级作用域的变量。在严格模式下，即使没有声明，也不允许隐式地创建全局变量。let 声明的变量无法在相同作用域内重新声明，也隔离了不同作用域内同名变量的值。

function example() {
  var x = 1;
  {
    let x = 2; // 在块级作用域内声明与全局作用域内同名的变量
    console.log(x); // 输出 2
  }
  console.log(x); // 输出 1
}

let 关键字还可以与 for 循环搭配使用，创建一个块级作用域，每次循环都有一个新的变量实例。

for (let i = 0; i < 3; i++) {
  setTimeout(function() { console.log(i); }, 1000 * i);
}

以上代码输出的是 0 1 2，如果使用 var 关键字，输出的将会是 3 3 3。

const

const 关键字用于声明一个块级作用域的常量。常量的值在声明后不可被更改。与 let 类似，常量也有块级作用域的概念，无法重复声明与隔离不同作用域内同名变量。

const PI = 3.14;
PI = 3; // TypeError: Assignment to constant variable.

与 let 类似，const 关键字也可以声明一个数组或对象型的常量。但是需要注意的是，这些变量本身所指向的内存地址不能改变，但是对象内部的值可以被改变。

const arr = [1, 2, 3];
arr.push(4); // 合法操作
arr = [4, 5, 6]; // TypeError: Assignment to constant variable.

与 var 的区别

var 关键字在全局作用域内声明的变量，实际上是创建了全局变量的一个属性。而 let 和 const 声明的变量，则不会为全局对象创建属性。

var a = 1;
console.log(window.a); // 输出 1
let b = 2;
console.log(window.b); // 输出 undefined

var 声明的变量是有提升效果的，可能会导致意料之外的 bug，而 let 和 const 声明的变量是没有提升效果的。

console.log(a); // 输出 undefined
var a = 1;

console.log(b); // ReferenceError: b is not defined
let b = 2;

在一般情况下，应优先使用 let 和 const 关键字来声明变量，以获取更好的代码质量与稳定性。

总结

let 和 const 关键字是 ES6 中引入的两个新的变量声明方式。let 和 const 声明变量的作用域是块级作用域，遵循作用域链的概念，不会污染全局作用域。let 和 const 声明的变量无法被重复声明，也不会存在变量提升的现象。与 var 相比，let 和 const 更加语义化、稳定、安全，应该是首选的变量声明方式。在实际使用时，需要根据具体情况选择使用。

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