ES6 notes（part1）

预备知识

Babel

作用：ES6 代码–>ES5 代码
安装：npm install --save-dev @babel/core
转码规则：npm install --save-dev @babel/preset-env
react转码规则：npm install --save-dev @babel/preset-react
配置文件（.babelrc ）：

 {
    "presets": [
      "@babel/env",
      "@babel/preset-react"
    ],
    "plugins": []
  }

命令行转码（@babel/cli）：npm install --save-dev @babel/cli
babel-node:提供一个支持 ES6 的 REPL 环境,支持 Node 的 REPL 环境的所有功能，而且可以直接运行 ES6 代码。

• 安装：npm install --save-dev @babel/node
• 进入REPL环境：npx babel-node
• 直接运行 ES6 脚本：npx babel-node es6.js

@babel/register 模块：npm install --save-dev @babel/register
此模块改写require命令，为它加上一个钩子。此后，每当使用require加载.js、.jsx、.es和.es6后缀名的文件，就会先用 Babel 进行转码。

require('@babel/register');
require('./es6.js');

polyfill

Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API，比如Iterator、Generator、Set、Map、Proxy、Reflect、Symbol、Promise等全局对象，以及一些定义在全局对象上的方法（比如Object.assign）都不会转码。
安装：npm install --save-dev core-js regenerator-runtime
脚本头部加入：

import 'core-js';
import 'regenerator-runtime/runtime';

或

require('core-js');
require('regenerator-runtime/runtime);

浏览器环境

<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script type="text/babel">
// Your ES6 code
</script>

let&const

let

作用：声明变量
和var的区别：
1.var是全局的，而let只在命令所在的代码块内有效
2.var命令会发生“变量提升”现象，即变量可以在声明之前使用，值为undefined；let命令所声明的变量一定要在声明后使用，否则报错。
3.let不允许重复声明
暂时性死区:只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。
块级作用域:let实际上为 JavaScript 新增了块级作用域

const

const 声明一个只读常量，声明之后不允许改变。一旦声明必须初始化，只声明不赋值，就会报错。
const声明的常量，也与let一样不可重复声明。

解构赋值

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。
数组模型的解构：let [a, b, c] = [1, 2, 3];
对象模型的解构：let { foo, bar } = { foo: 'aaa', bar: 'bbb' };
Set 结构：let [x, y, z] = new Set(['a', 'b', 'c']);
解构赋值允许指定默认值：let [x, y = 'b'] = ['a']; or var {x = 3} = {};
字符串的解构:const [a, b, c, d, e] = 'hello';