摘要：看代碼及注釋就懂了把代碼轉(zhuǎn)換為代碼解構(gòu)賦值字符串反引號(hào)代替引號(hào)代替了正則表達(dá)式匹配數(shù)組展開符利用的實(shí)現(xiàn)對(duì)象對(duì)象屬性有屬性有值集合和添加元素，但是不會(huì)添加相同的元素，利用這個(gè)特性實(shí)現(xiàn)數(shù)組去重元素?cái)?shù)量是否有指定元素刪除元

看代碼及注釋就懂了

$ npm install -g babel-cli

$ npm install babel-preset-env --save

$ babel ./src/es6.js -w --out-file ./dist/es5.js --presets env

const breakfast = () => ["cake", "coffee", "apple"]
let [dessert, drink, fruit] = breakfast()
console.info(dessert, drink, fruit) // "cake" "coffee" "apple"

const breakfast = () => {
    return {
        dessert: "cake",
        drink: "coffee",
        fruit: "apple"
    }
}
let {dessert, drink, fruit} = breakfast()
console.info(dessert, drink, fruit) // "cake" "coffee" "apple"

反引號(hào)代替引號(hào)：`some content ${variable} some content`

str.includes()、str.startsWidth()、str.endsWith() 代替了正則表達(dá)式匹配

// 利用 Array 的 concat() 實(shí)現(xiàn)
let breakfast = ["cake", "coffee", "apple"]
let food = ["rice", ...breakfast]
console.info(...breakfast, food) // "cake" "coffee" "apple", ["rice", "cake", "coffee", "apple"]

// 對(duì)象屬性
let food = {}
let drink = "hot drink"
food[drink] = "milk"
console.log(food["hot drink"]) // "milk"

let food = {}
let drink = "hot drink"
food[drink] = "milk"

let dessert = "cake"
food.fruit = "banane"

let breakfast = Object.assign({}, {dessert}, food) // {dessert} 有屬性有值
console.log(breakfast) // {dessert: "cake", hot drink: "milk", fruit: "banane"}

let fruit = new Set(["apple", "banane", "orange"])
/* 添加元素，但是不會(huì)添加相同的元素，利用這個(gè)特性實(shí)現(xiàn)數(shù)組去重：[...new Set(arr)] */
fruit.add("pear")
/* 元素?cái)?shù)量 */
console.log(fruit.size) // 4
/* 是否有指定元素 */
console.log(fruit.has("apple")) // true
/* 刪除元素 */
fruit.delete("banana") 

console.log(fruit) // Set(4)?{"apple", "banane", "orange", "pear"}
/* 遍歷 */
fruit.forEach(item => {
    console.log(item)
})
/* 清空 */
fruit.clear()

console.log(fruit) // Set(0)?{}

let food = new Map()
let fruit = {}, cook = function(){}, dessert = "甜點(diǎn)"
food.set(fruit, "apple")
food.set(cook, "knife")
food.set(dessert, "cake")

console.log(food, food.size) // Map(3)?{{…} => "apple", ? => "knife", "甜點(diǎn)" => "cake"} 3

console.log(food.get(fruit)) // "apple"
console.log(food.get(dessert)) // "cake"

food.delete(dessert)
console.log(food.has(dessert)) // false

food.forEach((value, key) => {
    console.log(`${key} = ${value}`) // [object Object] = apple    function(){} = knife
})

food.clear()
console.log(food) // Map(0)?{}

function* calc(num){
    yield num+1
    yield num-2
    yield num*3
    yield num/4
    return num
}
let cal = calc(4)
console.info(
    cal.next(), // {value: 5, done: false}
    cal.next(), // {value: 2, done: false}
    cal.next(), // {value: 12, done: false}
    cal.next(), // {value: 1, done: false}
    cal.next(), // {value: 4, done: true} 遍歷完了后 done:true
    cal.next() // {value: undefined, done: true}
)

class Chef{
    constructor(food){
        this.food = food;
        this.dish = [];
    }
    get menu(){ // 不得有參數(shù)（Getter must not have any formal parameters.)
        console.log("getter 取值")
        console.log(this.dish)
        return this.dish
    }
    set menu(dish){ // 必須有一個(gè)參數(shù)（Setter must have exactly one formal parameter.）
        console.log("setter 存值")
        this.dish.push(dish)
    }
    cook(){
        console.log(this.food)
    }
}
let Gu = new Chef("vegetables");
Gu.cook() // "vegetables"
console.log(Gu.menu) // "get 取值" []

Gu.menu = "egg" // "setter 存值"
Gu.menu = "fish" // "setter 存值"

console.log(Gu.menu); // "getter 取值" ["egg", "fish"]

class Person {
    constructor(name, birth){
        this.name = name
        this.birth = birth
    }
    intro(){
        return `${this.name}的生日是${this.birth}`
    }
}

class One extends Person {
    constructor(name, birth){
        super(name, birth)
    }
}

let z = new Person("zz", "01-09")
let x = new One("xx", "01-09")

console.log(z.intro(), x.intro()) // "zz的生日是01-09" "xx的生日是01-09"
// 轉(zhuǎn)化為ES5的代碼大概就是
/* function Person(name, birth) {
    this.name = name;
    this.birth = birth;
}
Person.prototype.intro = function () {
    return this.name + "u7684u751Fu65E5u662F" + this.birth;
};
function One(name, birth) {
    Person.apply(this, arguments);
}
One.prototype = new Person();
var z = new Person("zz", "01-09");
var x = new One("xx", "01-09");

console.log(z.intro(), x.intro()); // "zz的生日是01-09" "xx的生日是01-09" */

回調(diào)地獄

function ajax(fn){
    setTimeout(()=>{
        console.log("執(zhí)行業(yè)務(wù)")
        fn()
    },1000)
}
ajax(()=>{
    ajax(()=>{
        ajax(()=>{
            ajax(()=>{
                console.log("執(zhí)行結(jié)束4")
            })
            console.log("執(zhí)行結(jié)束3")
        })
        console.log("執(zhí)行結(jié)束2")
    })
    console.log("執(zhí)行結(jié)束1")
})
/*
    效果：
        1s： 執(zhí)行業(yè)務(wù) 執(zhí)行結(jié)束1
        2s:  執(zhí)行業(yè)務(wù) 執(zhí)行結(jié)束2
        3s： 執(zhí)行業(yè)務(wù) 執(zhí)行結(jié)束3
        4s:  執(zhí)行業(yè)務(wù) 執(zhí)行結(jié)束4
*/

Promise 這樣寫

function delay(word){
    return new Promise((reslove,reject) => {
        setTimeout(()=>{
            console.log("執(zhí)行業(yè)務(wù)")
            reslove(word)
        },1000)
    })
}
delay("執(zhí)行業(yè)務(wù)1")
    .then(word=>{
        console.log(word)
        return delay("執(zhí)行業(yè)務(wù)2")
    })
    .then(word=>{
        console.log(word)
        return delay("執(zhí)行業(yè)務(wù)3")
    })
    .then(word=>{
        console.log(word)
        return delay("執(zhí)行業(yè)務(wù)4")
    })
    .then(word=>{
        console.log(word)
    })
    .catch()

async + await

function delay(word){
    return new Promise((reslove, reject) => {
        setTimeout(()=>{
            console.log("執(zhí)行業(yè)務(wù)")
            reslove(word)
        },1000)
    })
}

const start = async () => {
    const word1 = await delay("執(zhí)行業(yè)務(wù)1")
    console.log(word1)

    const word2 = await delay("執(zhí)行業(yè)務(wù)2")
    console.log(word2)

    const word3 = await delay("執(zhí)行業(yè)務(wù)3")
    console.log(word3)
    
    const word4 = await delay("執(zhí)行業(yè)務(wù)4")
    console.log(word4)
}

start()