ES7 async、await 异步执行

题1：输出0，1，2，3，4
解法1：IIFE立即执行函数加形成闭包

for(var i=0;i<5;i++){
    (function (i) {
        setTimeout(function () {
            console.log(i) // 0,1,2,3,4
        }, 1000)
    })(i)
}

解法2：利用JS的基本类型中参数传递是按值传递的特征

var  output = function (i) {
    setTimeout(function () {
        console.log(i)   // 0,1,2,3,4
    }, 1000)
};
for (var i = 0; i < 5; i++) {
    output(i)
}

解法3：利用ES6的let块级作用域

for(let i=0;i<5;i++){
    setTimeout(function () {
        console.log(i)
    }, 1000)
}

题2：输出0，1，2，3，4，5 要求立即输出0，后每隔一秒输出后面的数字
解法1：利用ES6的新特性Promise

const tasks = [];
for(var i=0;i<5;i++){
    ((j) => {
        tasks.push(new Promise((resolve) => {
        setTimeout(function () {
            console.log(j)     //
            resolve() 
        }, 1000*j)  //定时器的时间逐步增加
    }))
    })(i)
}
Promise.all(tasks).then(() => {
    setTimeout(function(){
        console.log(i)
    },1000)
})

解法2：利用ES6的新特性Promise

const tasks = [];  //存放异步操作的Promise
const output = (i) => new Promise((resolve) => {
    setTimeout(function(){
        console.log(i)   //0，1，2，3，4
        resolve()
    },1000*i)
})
//生成全部的异步操作
for(var i=0;i<5;i++){
    tasks.push(output(i))
}
//异步操作完成后，输出最后的i的值
Promise.all(tasks).then(() => {
    setTimeout(function(){
        console.log(i)  //5
    },1000)
})

解法3：利用ES7中的async、await

const sleep = (times) => new Promise((resolve) => {
    setTimeout(resolve, times)
})

(async () => {    //声明即执行的async 函数表达式
    for(var i = 0;i<5;i++){
        await sleep(1000);
        console.log(i)
    }
    await sleep(1000);
    console.log(i)
})()