记录async/await学习

async函数用法和简要分析

学习阮一峰老师的ES6入门后的记录

1、Generator 函数

相当于一个状态机，返回一个可遍历的对象(该遍历器对象可以用for of等调用遍历接口的方法等调用值)，用function*来定义generator函数，yield来标记站厅点
示例：

    <script>
        function* helloWorldGenerator() { //function*:定义generator函数
            yield 'hello'; //yield:表示暂停执行的标志
            yield 111 + 233; //表达式并不会立刻计算，只有next到这才开始计算
            return 'ending';
        }

        var hw = helloWorldGenerator();

        console.log(hw.next()); //.next()，恢复执行
        console.log(hw.next());
        console.log(hw.next());
        console.log(hw.next());
        // {value: "hello", done: false}
        // {value: "344", done: false}
        // {value: "ending", done: true}
        // {value: undefined, done: true}
        //value为当前yield表达式的值，done：boolean，代表遍历是否结束
    </script>

2、协程的概念（异步编程）

• 第一步，协程A开始执行。
• 第二步，协程A执行到一半，进入暂停，执行权转移到协程B。
• 第三步，（一段时间后）协程B交还执行权。
• 第四步，协程A恢复执行。

3、async/await初步应用

async相当于*：代表异步操作的意思
await相当于yield:代表等待执行的意思

async函数相比与generator函数的差异在于：

• async内置执行器，所以不用.next()方式显示执行
• async函数返回的值是promise对象，可以用.then()方法调用
• async函数相比与generator函数，表示方式更加明白

简单示例：

    <script>
        async function helloWorldGenerator() { //function*:定义generator函数
            await console.log('hello'); //yield:表示暂停执行的标志
            await console.log(111 + 233); //表达式并不会立刻计算，只有next到这才开始计算
            return 'ending';
        }
        helloWorldGenerator();//普通函数一般执行
        //hello
        //344
    </script>

4、await注意点

• await后面如果跟一个promise对象要注意有catch情况
• await后面如果跟一个异步函数操作会暂时跳出当前async函数，执行接下来的代码
• await后面如果跟一个普通变量，会将其注册为微任务，相当于promise.then()方法
• await注意并发还是继发