var，const，let

变量声明：var，const，let

在JavaScript中，有三个关键字可用于声明一个变量，而且每一个关键字都有其不一样之处。那些是var，let并且const

简短的解释

使用const关键字声明的变量不能被从新赋值，let并且var能够。

	范围	从新赋值	易变的	暂时性死区
const	块	否	是	是
let	块	是	是	是
var	功能	是	是	否

示例代码

const person = "Nick";
person = "John"; // Will raise an error, person can't be reassigned 复制代码

let person = "Nick";
person = "John";
console.log(person); // "John", reassignment is allowed with let
复制代码

详细的解释

变量的范围大体意味着“代码中可用的变量的做用域”。

var

var声明的变量是函数做用域的，这意味着当在函数中建立变量时，该函数中的全部内容均可以访问该变量。此外，函数中建立的函数做用域变量不能在此函数以外访问。

示例代码

function myFunction() {
  var myVar = "Nick";
  console.log(myVar); // "Nick" - myVar is accessible inside the function
}
console.log(myVar); // Throws a ReferenceError, myVar is not accessible outside the function.
复制代码

function myFunction() {
  var myVar = "Nick";
  if (true) {
    var myVar = "John";
    console.log(myVar); // "John"
    // actually, myVar being function scoped, we just erased the previous myVar value "Nick" for "John"
  }
  console.log(myVar); // "John" - see how the instructions in the if block affected this value
}
console.log(myVar); // Throws a ReferenceError, myVar is not accessible outside the function.
复制代码

这部分代码:

console.log(myVar) // undefined -- no error raised
var myVar = 2;
复制代码

在执行中被理解为：

var myVar;
console.log(myVar) // undefined -- no error raised
myVar = 2;
复制代码

let

var和let大体相同，但let声明的变量

• 是块范围
• 不存在变量提高
• 不能在同一范围内从新声明

示例代码

function myFunction() {
  let myVar = "Nick";
  if (true) {
    let myVar = "John";
    console.log(myVar); // "John"
    // actually, myVar being block scoped, we just created a new variable myVar.
    // this variable is not accessible outside this block and totally independent
    // from the first myVar created !
  }
  console.log(myVar); // "Nick", see how the instructions in the if block DID NOT affect this value
}
console.log(myVar); // Throws a ReferenceError, myVar is not accessible outside the function.
复制代码

如今，let（和const）变量在分配前不可访问的含义是什么：

// var 的状况
console.log(foo); // 输出undefined
var foo = 2;

// let 的状况
console.log(bar); // 报错ReferenceError
let bar = 2;
复制代码

与var变量相比，若是在分配以前尝试读取或写入let或const变量，则会引起错误。这种现象一般称为暂时性死区或TDZ。

另外，你不能从新声明一个let变量：

let myVar = 2;
let myVar = 3; // Raises a SyntaxError
复制代码

const （常量）

const声明的变量行为就像let变量同样，但也不能被从新赋值。 总结一下，const变量：

• 是块范围
• 在赋值以前不可访问
• 不能在同一范围内从新定义
• 不能从新赋值

实例代码

const myVar = "Nick";
myVar = "John" // raises an error, reassignment is not allowed
复制代码

const myVar = "Nick";
const myVar = "John" // raises an error, re-declaration is not allowed
复制代码

但有一个微妙之处：const变量不是不变的！具体而言，这意味着对象和数组 const声明的变量可能会发生变化。

对于对象:

const person = {
  name: 'Nick'
};
person.name = 'John' // this will work ! person variable is not completely reassigned, but mutated
console.log(person.name) // "John"
person = "Sandra" // raises an error, because reassignment is not allowed with const declared variables
复制代码

对于数组:

const person = [];
person.push('John'); // this will work ! person variable is not completely reassigned, but mutated
console.log(person[0]) // "John"
person = ["Nick"] // raises an error, because reassignment is not allowed with const declared variables
复制代码

参考资料

• let 和 const 命令
• let和const如何在JavaScript中定义范围 - WesBos
• 暂时性死区（TDZ）揭秘