关于await的执行顺序

Question

     async function fn() {
            return Promise.resolve("fn"); 
        }
        async function clg() {
            console.log(await fn());// 8
        }
        async function async1() {
            console.log("async1 start");// 4
            await async2();
            console.log("async1 end");// 7
        }
        async function async2() {
            console.log("async2");// 5
        }

        console.log("aaaaa");// 1
        clg();
        console.log("fnn");// 2

        console.log("start");// 3
        async1();
        console.log("end");// 6

为什么输出“fn”比输出“async1 end”还晚呢？
event loop第一个轮询到的不应该是先await的fn()嘛？

Answer 1

双越 2021-01-27 17:38:37

你把 clg 函数的代码拆开，就能看明白了

        async function clg() {
            const res = await fn();
            console.log(res);
        }

我们课程里说过，await 的后面（下一行开始）就相当于异步 callback 中的内容。

所以，它输出会晚。

• 提问者 慕桂英7180857 #1

  噢，那也就是await后面的语句相当于异步回调。等待异步代码执行完后，就执行后面的语句。
  我还是有点不太明白，就是clg函数中await先抛入到异步中，为什么回调的语句是最后输出呢。

• 双越 回复 提问者 慕桂英7180857 #2

  因为 fn 函数返回的是 Promise 对象，如果返回的是一个字符串 'fn' ，你代码中 7 8 就会调换顺序了。

• 提问者 慕桂英7180857 回复 双越 #3

  噢，原来是这一回事！还请麻烦老师再解释下返回字符串和promise对象的区别。我发现我的fn函数多加了sync关键字，如果删掉了就按我之前想的，先输出”fn“再输出”async1 end“。我有点不解这点的影响

点开查看后面2条评论

Answer 2

Legolas_Xero 2021-03-24 17:28:19

await后面的代码相当于异步，这个异步是微任务还是宏任务