微任务顺序和课程里面不一样？

来源：8-17 解答JS异步的面试题

薄樱猫猫

2022-03-03

就是这个题目，课程里讲的，先执行‘async1 end’，再执行’promise2’。但我这边执行全部代码后，先执行了’promise2’，再执行‘async1 end’。我确定没写错代码。所以这是为啥？

async function async1 () {
  console.log('async1 start')
  await async2() 
  console.log('async1 end') 
}

async function async2 () {
  console.log('async2')
}

console.log('script start')

setTimeout(function () { 
  console.log('setTimeout')
}, 0)

async1()

new Promise (function (resolve) { 
  console.log('promise1') 
  resolve()
}).then (function () { 
  console.log('promise2')
})

console.log('script end')

图片描述

写回答

2回答

几盎丶

2022-03-03

已采纳

可能和你的浏览器版本有关，我最近也在学，读了一篇文章，最新的chrome对async/await进行了优化。

//img.mukewang.com/szimg/6220cc33095e5bc213420194.jpg

即对await 的下一行代码，等同于下面一行

return RESOLVE(p).then(()=>{
    ```await```以下的代码
})

而代码中的『RESOLVE(p)』接近于『Promise.resolve(p)』，不过有微妙而重要的区别：p 如果本身已经是 Promise 实例，Promise.resolve 会直接返回 p 而不是产生一个新 promise。

具体可以看这个链接

https://www.zhihu.com/question/268007969

薄樱猫猫

顺着你给的链接，查到这个和浏览器和运行环境有关系。。我了启动一个vue项目，把题目的代码写成方法在created()调用，顺序和课程一样。。代码直接放在控制台输出，就和我的问题里面一样。我截图放上面了

2022-03-04

共1条回复

双越

2022-03-03

我不知道你那儿为啥是这个顺序。

我把你的代码拷贝，执行，顺序是这样的，如下图：

//img.mukewang.com/szimg/6220abfa09b895b306521186.jpg

薄樱猫猫

这个和浏览器和运行环境有关系。。我了启动一个vue项目，把题目的代码写成方法在created()调用，顺序和课程一样。。代码直接放在控制台输出，就和我的问题里面一样。我截图放上面了 https://www.zhihu.com/question/268007969 https://www.zhihu.com/question/270515346 这俩讲解了这个问题。。不过基本给我讲懵了。。。

2022-03-04

共1条回复

一天时间高效准备前端技术一面匹配大厂面试要求

针对时下面试高频考点，帮助新人js面试快速通关

4694 学习 · 1681 问题

查看课程

相似问题

微任务在渲染前执行，为什么这么设计呢

回答 2

ajax是宏任务的话 axios，fetch是否为宏任务

回答 1

微任务中产生的微任务执行顺序是什么？

回答 1

.then不符合微任务的执行顺序

回答 1

宏任务和微任务的执行顺序

回答 2

打开慕课网App查看更多内容