异步执行顺序问题 #

阅读下面代码，我们只考虑浏览器环境下的输出结果，写出它们结果打印的先后顺序，并分析出原因，小伙伴们，加油哦！

async function async1() {
  console.log("AAAA");
  async2();
  console.log("BBBB");
}

async function async2() {
  console.log("CCCC");
}

console.log("DDDD");

setTimeout(function () {
  console.log("FFFF");
}, 0);

async1();

new Promise(function (resolve) {
  console.log("GGGG");
  resolve();
}).then(function () {
  console.log("HHHH");
});

console.log("IIII");

答案：

浏览器下 输出结果的先后顺序是

DDDD
AAAA
CCCC
BBBB
GGGG
IIII
HHHH
FFFF

答案解析：这道题考察重点是 js异步执行 宏任务 微任务.

这道题的坑就在于 async中如果没有await，那么它就是一个纯同步函数。

这道题的起始代码在第9行，输出DDDD

第10行计时器开启一个异步任务t1（一个称呼），这个任务且为宏任务。

第13行函数async1执行，这个函数内没有await 所以它其实就是一个纯同步函数，打印输出AAAA,

在async1中执行async2函数，因为async2的内部也没有await，所以它也是个纯同步函数，打印输出CCCC

紧接着打印输出BBBB。

第14行new Promise执行里面的代码也是同步的,所以打印输出GGGG,resolve()调用的时候开启一个异步任务t2（一个称呼），且这个任务t2是微任务，它的执行交给then()中的第一个回调函数执行，且优先级高于宏任务（t1）执行。

第20行打印输出IIII,此时线程上的同步任务全部执行结束。

在执行任务队列中的异步任务时，微任务优先于宏任务执行，所以先执行微任务 t2 打印输出 HHHH,然后执行宏任务 t1 打印输出 FFFF

所以综上 结果输出是 DDDD AAAA CCCC BBBB GGGG IIII HHHH FFFF