ES6 基础
1. ECMAScript 简介
（1）. ECMAScript 和 JavaScript 的关系
ECMAScript 是 JavaScript 的规范，JavaScript 是 ECMAScript 的一种实现。
（2）. ES6 与 ECMAScript 2015 的关系
ES6 是一个泛指，含义是 ES5.1 版本以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017等等。而 ES2015 则是正式名称，特指2015年发布的正式版本的语言标准。
（3）Babel转码器
安装 babel
npm install --save-dev @babel/core
// -S \ -D 区分产品安装依赖还是开发安装依赖
TIPS
-S, --save: Package will appear in your dependencies.
-D | -P, --save-dev: Package will appear in your devDependencies.
-O, --save-optional: Package will appear in your optionalDependencies.
配置文件 .babelrc（用于设置转码规则和插件）
基本格式如下：
{
"presets": [],
"plugins": []
}
presets 字段设定转码规则，官方提供以下的规则集，你可以根据需要安装。
// 最新转码规则
npm install --save-dev @babel/preset-env
// react 转码规则
npm install --save-dev @babel/preset-react
然后将这些规则加入 .babelrc
{
"presets": [
"@babel/env",
"@babel/preset-react"
],
"plugins": []
}
命令行转码
Babel 提供命令行转码工具 @babel/cli，用于命令行转码。
安装@babel/cli
npm install --save-dev @babel/cli
基本用法:
# 转码结果输出到标准输出
$ npx babel example.js
# 转码结果写入一个文件
# --out-file 或 -o 参数指定输出文件
$ npx babel example.js --out-file compiled.js
# 或者
$ npx babel example.js -o compiled.js
# 整个目录转码
# --out-dir 或 -d 参数指定输出目录
$ npx babel src --out-dir lib
# 或者
$ npx babel src -d lib
# -s 参数生成source map文件
$ npx babel src -d lib -s
2. let 和 const 命令
（1）let 和 const 的共同点：
1）不会存在变量提升
2）会造成暂时性死区
3）不允许重复声明
（2）let 的其它特点
let 为 JavaScript 新增了块级作用域
（3）const 的其它特点
const 声明的是一个只读的变量（const 一旦声明变量，就必须立即初始化）。
const 实质上保证的是：变量所指向的那个内存地址的数据不得更改。（对于简单数据类型而言，const 声明的变量就是一个常量；当时对于复合数据类型而言，只是说指向对象的内存地址不变，却不能保证具体的数据不发生改变）
（4）ES6 声明变量的六种方法
var
function
let
const
class
import
后四种是 ES6 中新增的。
3. 变量的解构赋值
基本用法： 按照一定的模式，从数组和对象中提取值，对变量进行赋值。
（1）数组的解构赋值
let [a, b, c] = [1, 2, 3]; // a = 1, b = 2, c = 3
let [foo, [bar], baz] = [1, [2], 3];
// bar = 2, baz = 3
let [ , , third] = [1, 2, 3];
// third = 3;
let [x, , y] = [1, 2, 3];
// y = 3
let [head, ...tail] = [1, 2, 3, 4];
// tail = [2, 3, 4]
let [x, y, ...z] = ['a'];
// x = 'a', y = undefined, z = []
// 如果解构不成功，那么变量的值就等于 undefined
对数组可进行对象解构赋值
let arr = [1, 2, 3];
let { 0: first, [arr.length - 1]: last } = arr;
// first = 1, last = 3
（2）对象的解构赋值
对象的解构赋值的规则与数组的类似，其中比较重要的一个不同点就是：数组的解构赋值与数组数据的次序关系密切；而对象的解构赋值则不是这样的，变量的取值与对象的属性名关系密切。如果变量名与对象某个属性名相同，则被赋值对应的属性值。
let { log, sin, cos } = Math;
// 对象的解构赋值，可以很方便地将对象的方法赋值给某个变量。
如果变量名与属性名不一致，则要采取如下的语法：
let { foo: baz } = { bar: 1, foo: 2 };
// baz = 2
// foo: error: foo is not defined
（3）字符串的解构赋值
const [ a, b, c, d, e ] = 'hello';
// a = 'h', e = 'o'
let { length: len } = 'hello';
// len = 5
（4）数值和布尔值的解构赋值
解构赋值时，如果等号右边是数值和布尔值，则会先转为对象。
let { toString: s } = 123;
s === Number.prototype.toString // true
let {toString: s} = true;
s === Boolean.prototype.toString // true
(5) 函数参数的解构赋值
function add([x, y]){
return x + y;
}
add([1, 2]); // 3
（6）解构赋值中的默认值
无论是数组还是对象的解构赋值，只有当变量取值严格等于 undefined 时，默认值才会被赋给变量
let [x = 1] = [];
// x = 1
let [x = 1] = [undefined];
// x = 1
let [x = 1] = [null];
// x = null
let [x = 1, y = x] = []; // x=1; y=1
let [x = 1, y = x] = [2]; // x=2; y=2
let [x = 1, y = x] = [1, 2]; // x=1; y=2
let [x = y, y = 1] = []; // ReferenceError: y is not defined
var {x = 3} = {};
// x = 3
var {x, y = 5} = {x: 1};
// x = 1
// y = 5
var {x: y = 3} = {};
// y = 3
var {x: y = 3} = {x: 5};
// y = 5
var { message: msg = 'Something went wrong' } = {};
// msg = "Something went wrong"
默认值生效的条件是，对象的属性值严格等于undefined。
var {x = 3} = {x: undefined};
// x = 3
var {x = 3} = {x: null};
// x = null
（7）用途
1）交换变量的值
2）从函数返回多个值，可以很方便解构赋值给变量
3）提取 JSON 数据
4）函数参数的默认值
5）输入模块的指定方法
（8）其它说明
1）如果解构失败，则变量的值为 undefined
2）解构赋值的规则是，只要等号右边的值不是对象或数组，就先将其转为对象。由于undefined和null无法转为对象，所以对它们进行解构赋值，都会报错。
