JavaScript ES6 var VS let 区别

ECMAScript 6 即 ES 6 中引入了 let 语句。

The let statement declares a block scope local variable, optionally initializing it to a value.
let 语句用于声明一个局部变量，作用域为 block scope，可以在声明时初始化。

var VS let 区别

区别在于声明变量的作用域 Scope:

• var 语句声明的变量，作用域为 Function Scope 方法作用域
• let 语句声明的变量，作用域为 Block Scope 代码块作用域，可能比 Function Scope 范围更小，也可能相同
• 如果在任何的 block 外部使用 var 或者 let，则声明的变量均为全局变量，即 Global Scope
• let 语句声明的变量，在声明之前不能访问，否则会抛出 ReferenceError

Global Scope 全局作用域

注意：let 语句声明的变量，不能通过 window 对象来访问。

var foo1 = 1;
let foo2 = 2; // foo1 和 foo2 均为全局作用域 Global Scope

console.log(foo1); // 1
console.log(foo2); // 2

console.log(window.foo1); // 1
console.log(window.foo2); // undefined

Function Scope 方法作用域

function f() {
  var foo1 = 1;
  let foo2 = 2; // foo1 和 foo2 均为方法作用域 Function Scope
  
  console.log(foo1); // 1
  console.log(foo2); // 2
}

f();

Block Scope 代码块作用域

在下面的代码中可以看到 var 与 let 语句声明变量的区别：

function f() {
  var foo1 = 1; // Function Scope
  
  {
    let foo1 = 2; // Block Scope
    let foo2 = 3; // Block Scope
    
    console.log(foo1); // 2
    console.log(foo2); // 3
  }
  
  console.log(foo1); // 1
  console.log(foo2); // foo2 is not defined
}

f();

如果将 let foo1 = 2; let foo2 = 3; 换成 var foo1 = 2; var foo2 = 3;，则都变成 Function Scope。

引用：
let