async await在es6下编译为generator

88 阅读1分钟

1.await避免直接出现于表达式中

应当避免await、yield直接出现在表达式中,而是用一个变量去接受它的值,否则异步的情况下容易出现上述问题;同如果用变量去承载它的话可以使逻辑更清晰,也不需要考虑这2个操作符的权重问题

generator执行的步骤

async await编译为es6:

实际上是使用generator写的

generator运行时机

  1. 从调用第一个next,函数才开始执行,直到执行完第一个yield 及其后面的表达式(yield操作符的表达式);此时yield后面的表达式执行完毕,并且yield也有返回值了,然后立即停止;

然后调用第二个next:

  1. 从上一个停止的地方开始,到下一个yield及其后面的表达式;然后停止

迭代与return

1.使用for of,或者[...generator]去操作迭代器的时候,它们只会识别done为false的时候的value; 如果最后一个yield后面还有内容,那么for of和...不会收集到它这个函数的返回值;并且它将被彻底丢弃; for of的次数等于yield的数量;

function* generator(arg) {
            yield 1;
            yield 2;
            console.log('结束:', arg)
            return 0
        }


        let go2 = generator('go_2')
        console.log(go2.next()) // {value:1, done:false}
        console.log(go2.next()) // {value:2, done:false}
        console.log(go2.next()) // {value:0, done:true};这样才能取到函数的返回值
        console.log(go2.next()) // {value:undefined, done:true}
        console.log(go2.next()) // {value:undefined, done:true}
        
        
        let go = generator('go_1')
        for (const iterator of go) { // 如果使用...或者for of,那么这个迭代器的返回值:0 将永远也取不到了
            console.log(iterator, '----'); // 有2个yield,这里迭代了2次,但是最后一个yield后续的代码也会被执行
        }
        console.log(go.next(), '***') // {value:undefined, done:true}  go永远也取不到那个函数返回的0了