记录整理日常开发中所使用的ES6语法/API，及其遇到的各种难点及教程（不定时更新）...

---

1、变量声明let和const
在ES6之前的ES5时代，声明变量用var，但是无论声明在何处，都会被变量提升在最顶部(函数内会被提升到函数最顶部，不在函数内即在全局作用域的最顶部)。
而let和const，其中最重要的两个特性就是提供了块级作用域和不再具备变量提升。
怎么理解块级作用域呢？？

在一个函数内部，在一个代码块内部
说白了只要在{}大括号内的代码块即可以认为 let 和 const 的作用域。

例如：

// let声明变量
for(let i=0; i<10; i++) {
    console.log(i);
}
console.log(i); // 块外调用会报错：Uncaught ReferenceError: i is not defined

// const声明常量
const id = 123;
id = 456; // 再次修改会报错：Uncaught TypeError: Assignment to constant variable.

2、箭头函数=>

var f = v => v;

上面的箭头函数等同于：

var f = function(v) {
  return v;
};

3、解构赋值
解析结构是一种全新的写法，我们只需要使用一个例子，大家就能够明白解析结构到底是怎么一回事儿。

首先有这么一个对象

const props = {
    className: 'tiger-button',
    loading: false,
    clicked: true,
    disabled: 'disabled'
}

当我们想要取得其中的2个值：loading与clicked时：

// es5
var loading = props.loading;
var clicked = props.clicked;

// es6
const { loading, clicked } = props;

给一个默认值，当props对象中找不到loading时，loading就等于该默认值

const { loading = false, clicked } = props;

是不是简单了许多？正是由于解析结构大大减少了代码量，因此它大受欢迎，在很多代码中它的影子随处可见。

比如

// section1 
import React, { Component } from 'react';

// section2
export { default } from './Button';

// section3
const { click, loading } = this.props;
const { isCheck } = this.state;

more 任何获取对象属性值的场景都可以使用解析结构来减少我们的代码量
另外，数组也有属于自己的解析结构。

// es6
const arr = [1, 2, 3];
const [a, b, c] = arr;

// es5
var arr = [1, 2, 3];
var a = arr[0];
var b = arr[1];
var c = arr[2];

数组以序列号一一对应，这是一个有序的对应关系。
而对象根据属性名一一对应，这是一个无序的对应关系。
根据这个特性，使用解析结构从对象中获取属性值更加具有可用性。

10、await 多个 async 函数
在使用 async/await 的时候，可以使用 Promise.all 来 await 多个 async 函数

await Promise.all([anAsyncCall(), thisIsAlsoAsync(), oneMore()])