你真的懂promise吗?promise then执行先后顺序,高手解答一下。附上题目

问题描述

下面题目执行输出顺序对吗?为什么?
有大神懂得,解释解释

问题出现的环境背景及自己尝试过哪些方法

相关代码

new Promise((resolve,reject)=>{
    console.log("promise1",1) 
    resolve()
}).then(()=>{
    console.log("then11",2)
    new Promise((resolve,reject)=>{
        console.log("promise2",3)
        resolve();
    }).then(()=>{
        console.log("then21",4)
        new Promise((resolve,reject)=>{
            console.log("promise3",5)
            resolve();
        }).then(()=>{
            console.log("then31",7)
        }).then(()=>{
                console.log("then32",9)
        })
    }).then(()=>{
        console.log("then22",8)
    })
}).then(()=>{
    console.log("then12",6)
})  

你期待的结果是什么?实际看到的错误信息又是什么?

感觉会输出 1->2->3->6->4->5->8->7->9。
实际结果 1->2->3->4->5->6->7->8->9。

阅读 5.6k
5 个回答

我觉得坑可能是then会返回Promise对象,也就是在then链里面前面的then入队后,出队执行返回Promise,后面的一个then才会入队等待。
也就是说不是promise1执行=>then11入队=>then12入队=>结束=>then11出队=>promise2执行=>then21入队=>then22入队=>结束=>then12出队=>hen21出队=>...

then12要等待then11出队执行返回Promise后才能入队,同理22要等21,32要等31:
promise1执行=>then11入队=>结束 // 输出:1
=>then11出队=>promise2执行=>then21入队=>返回11promise // 输出:2=>3
=>then12入队=>结束
=>then21出队=>promise3执行=>then31入队=>返回21promise // 输出:4=>5
=>then22入队=>结束
=>then12出队=>then31出队=>返回31promise // 输出:6=>7
=>then32入队=>结束
=>then22出队=>then32出队 // 输出:8=>9

昨天还看到别人在讲这个,我把他文章给你吧,我觉得已经讲得很不错了。地址:执行顺序,最重要的是要了解事件循环,宏任务,微任务的区别,然后就是究竟什么时候才会把then推进微任务队列

你这里如果指的是浏览器实现的 Promise,都是 microtask,当然是第二种输出了,当然了,如果 Promise 的实现方式是用第三方实现的话,有可能会出现别的顺序。

作为考试题可以,实际操作中不应该这么写代码。一般我们把 Promise 写成链式。

新手上路,请多包涵

第一轮
输出 1
微任务 promise1的第一个then

第二轮
输出 2 3
微任务 promise2的第一个then、promise1的第二个then

第三轮
输出 4 5 6
微任务 promise3的第一个then、promise2的第二个then

第四轮
输出 7 8
微任务 promise3的第二个then

第五轮 9
微任务 空

推荐问题
宣传栏