let
ES6新增let命令，用来声明变量，类似于var，但是let声明的变量只在代码块内有效。
{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
for循环
for 循环的计数器，很适合let命令
for (let i = 0; i < 10; i++) {
// ...
}
console.log(i);
// ReferenceError: i is not defined
如果是使用var，则下面代码输出会是10，因为每次循环的i都是一样的。
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 10
如果是使用let，则下面代码输出会是6，因为每次循环的i都是新的变量。
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
for 循环的另一个特别之处是，设置循环变量的部分是父作用域，而循环体内是单独的子作用域。
for (let i = 0; i < 3; i++) {
let i = 'abc';
console.log(i);
}
// abc
// abc
// abc
不存在变量提升
var声明的变量会出现“变量提升”的现象，也就是变量在声明之前使用，此时变量值为undefined。
let改变了语法行为，它声明的变量一定要在声明后使用，否则报错。
// var 的情况
console.log(foo); // 输出undefined
var foo = 2;
// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;
暂时性死区
只要块级作用域存在let命令，它所声明的变量便绑定在这个区域，不受外部影响。
var tmp = 123;
if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}
在代码块内，let声明的变量之前，该变量都不可用，这在语法上称为“暂时性死区”（temporal dead zone，TDZ）
if (true) {
// TDZ开始
tmp = 'abc'; // ReferenceError
console.log(tmp); // ReferenceError
let tmp; // TDZ结束
console.log(tmp); // undefined
tmp = 123;
console.log(tmp); // 123
}
TDZ的存在，意味着typeof不再是百分百安全的操作
typeof x; // ReferenceError
let x;
下面的行为也会报错
// 不报错
var x = x;
// 报错
let x = x;
// ReferenceError: x is not defined
不允许重复声明
let不允许在相同的作用域，重复声明同一个变量
// 报错
function func() {
let a = 10;
var a = 1;
}
// 报错
function func() {
let a = 10;
let a = 1;
}
因此，不能在函数内部重新声明参数
function func(arg) {
let arg; // 报错
}
function func(arg) {
{
let arg; // 不报错
}
}
块级作用域
ES5只有全局作用域和函数作用域，没有块级作用域，这会出现很多不合理的场景。
场景1：内部变量可能覆盖外层变量。
var tmp = new Date();
function f() {
console.log(tmp);
if (false) {
var tmp = 'hello world';
}
}
f(); // undefined
场景2：计数的循环变量泄露为全局变量。
var s = 'hello';
for (var i = 0; i < s.length; i++) {
console.log(s[i]);
}
console.log(i); // 5
ES6块级作用域
let实际为js新增块级作用域。
function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); // 5
}
ES6允许块级作用域的任意嵌套，外层作用域无法读取内存作用域的变量。
{{{{
{let insane = 'Hello World'}
console.log(insane); // 报错
}}}};
内层作用域可以定义外层作用域的同名变量。
{{{{
let insane = 'Hello World';
{let insane = 'Hello World'}
}}}};
块级作用域的出现，使得广泛使用的IIFE（立即执行函数表达式）不再必要。
// IIFE 写法
(function () {
var tmp = ...;
...
}());
// 块级作用域写法
{
let tmp = ...;
...
}
块级作用域与函数声明
ES6允许在块级作用域声明函数，声明的函数在作用域之外不可引见。
function f() { console.log('I am outside!'); }
(function () {
if (false) {
// 重复声明一次函数f
function f() { console.log('I am inside!'); }
}
f();
}());
上面代码在ES5中可以运行，实际运行代码是
// ES5 环境
function f() { console.log('I am outside!'); }
(function () {
function f() { console.log('I am inside!'); }
if (false) {
}
f();
}());
而在浏览器的ES6环境，块级作用域声明的函数，行为类似于var声明的变量
// 浏览器的 ES6 环境
function f() { console.log('I am outside!'); }
(function () {
if (false) {
// 重复声明一次函数f
function f() { console.log('I am inside!'); }
}
f();
}());
// Uncaught TypeError: f is not a function
而实际运行的代码是
// 浏览器的 ES6 环境
function f() { console.log('I am outside!'); }
(function () {
var f = undefined;
if (false) {
function f() { console.log('I am inside!'); }
}
f();
}());
// Uncaught TypeError: f is not a function
考虑到环境导致的差异很大，应避免在块级作用域声明函数，如果必要，可以写成函数表达式。
// 函数声明语句
{
let a = 'secret';
function f() {
return a;
}
}
// 函数表达式
{
let a = 'secret';
let f = function () {
return a;
};
}
ES6的块级作用域允许声明函数的规则，只在使用大括号的情况下成立，如果没有使用大括号，就会报错。
// 不报错
'use strict';
if (true) {
function f() {}
}
// 报错
'use strict';
if (true)
function f() {}
const
const声明只读常量，一旦声明，常量的值就不能改变。
const PI = 3.1415;
PI // 3.1415
PI = 3;
// TypeError: Assignment to constant variable.
这同时意味着，const一旦声明变量，就必须立即初始化。
const foo;
// SyntaxError: Missing initializer in const declaration
const的作用域与let命令相同，声明的常量也不能提升，同样存在暂时性死区，同样不能重复声明。
const实际保证的是，变量指向的内存地址不得改动。因此对于复合型数据，它依然可能发生改变。
因此，将一个对象声明为常量必须非常小心。
const foo = {};
// 为 foo 添加一个属性，可以成功
foo.prop = 123;
foo.prop // 123
// 将 foo 指向另一个对象，就会报错
foo = {}; // TypeError: "foo" is read-only
或者是声明为数组
const a = [];
a.push('Hello'); // 可执行
a.length = 0; // 可执行
a = ['Dave']; // 报错
如果需要将帝乡冻结，可以使用Object.freeze 方法
const foo = Object.freeze({});
// 常规模式时，下面一行不起作用；
// 严格模式时，该行会报错
foo.prop = 123;
冻结仅是对对象本身的冻结，对属性并不起作用。对对象彻底冻结的函数
var constantize = (obj) => {
Object.freeze(obj);
Object.keys(obj).forEach( (key, i) => {
if ( typeof obj[key] === 'object' ) {
constantize( obj[key] );
}
});
};
顶层对象
顶层对象，在浏览器环境指的是window对象，在Node指的是global对象。在ES5，顶层对象的属性与全局变量是等价的。
window.a = 1;
a // 1
a = 2;
window.a // 2
ES6对于顶层对象与全局变量的关联设计做出改变，规定var和function声明的全局变量，依旧是顶层对象的属性。
let、const、class声明的全局变量，不属于顶层对象的属性。
var a = 1;
// 如果在 Node 的 REPL 环境，可以写成 global.a
// 或者采用通用方法，写成 this.a
window.a // 1
let b = 1;
window.b // undefined
global对象
ES5的顶层对象不统一：
浏览器：顶层对象window，但Node和Web Worker没有window
浏览器和web worker：self指向顶层对象，但Node没有self
Node：顶层对象是global，但其他环境不支持
为在各种环境都能获取顶层对象，一般使用this变量，但存在局限性：
全局环境，this返回顶层对象；但在Node模块和ES6模块，this返回当前模块
函数里的this，如果函数并不作为对象方法运行，则this指向顶层对象；在雅阁模式，this会返回undefined
不管严格模式，还是普通模式，
new Function('return this')()，总是返回全局对象；但是如果浏览器使用CSP，则eval、new Function无法使用
勉强的方法
// 方法一
(typeof window !== 'undefined'
? window
: (typeof process === 'object' &&
typeof require === 'function' &&
typeof global === 'object')
? global
: this);
// 方法二
var getGlobal = function () {
if (typeof self !== 'undefined') { return self; }
if (typeof window !== 'undefined') { return window; }
if (typeof global !== 'undefined') { return global; }
throw new Error('unable to locate global object');
};
现在的提案是，在语言标准引入global作为顶层对象。
垫片库system.global 模拟改天，可以在所有环境获取global
// CommonJS 的写法
require('system.global/shim')();
// ES6 模块的写法
import shim from 'system.global/shim'; shim();
获取global对象
// CommonJS 的写法
var global = require('system.global')();
// ES6 模块的写法
import getGlobal from 'system.global';
const global = getGlobal();
【参考】