关于async、await返回一个Promise微任务

最新推荐文章于 2024-09-29 10:01:27 发布

牛战士超神了

最新推荐文章于 2024-09-29 10:01:27 发布

阅读量1.9k

点赞数

分类专栏： async、await JS 文章标签： javascript

本文链接：https://blog.csdn.net/qq_45332221/article/details/119572616

版权

本文通过一个实例探讨了async函数中await关键字的执行特点，指出await不会阻塞主线程，而是将后续代码放入微任务队列。当主线程执行完毕后，按照事件循环机制，从微任务队列中取出任务执行。对于多个await的情况，后续代码会被视为一个整体，按顺序加入微任务队列。

摘要由CSDN通过智能技术生成

一、案例

在刷题过程中碰到的问题，打破了我一直以为对async、await可以看成同步队列的认知。
在async中同时有两个await或多个await的时候，并且这对个await中还夹杂了其他的代码，然后主线程中还有其他的任务会抛出微任务的情况下。就完全不是我们想象的当成同步队列来输出了。

代码如下图

	console.log("script start");//1
    async function async1() {
        console.log("开始");//2
        await async2();
        console.log("中间");//6
        await async3();
        console.log("结束");//9
    }
    async function async2() {
        console.log("async2 end");//3
    }
    async function async3() {
        console.log("async3 end");//7
    }
    async1();
    setTimeout(function () {
        console.log("setTimeout");//11
    }, 0);

    new Promise((resolve) => {
        console.log("Promise");//4
        resolve();
    }).then(function () {
        console.log("promise1");//8
    }).then(function () {
        console.log("promise2");//10
    })