Promise中同步执行的顺序

Order of synchronous execution in Promise

本文关键字：顺序 执行 同步 Promise      更新时间：2023-09-26

我在事件监听器中测试Promise时遇到了一个问题。一切都很好，只是执行命令。

var test = document.querySelector('#test');
test.addEventListener('click',function(){
    Promise.resolve().then(function(){
        throw 'first';
    }).catch(function(er){
    	console.log(er);
    });
});
test.addEventListener('click',function(){
    console.log('second');
});
test.click();
<div id="test"></div>

为什么第二个听众比第一个听众提前结束？

根据标准要求，它的行为如下：

  1. 否则，如果promise的[[PromiseState]]内部插槽的值为"fulfilled"，
    a.设value为promise的[[PromiseResult]]内部插槽的值
    b.执行EnqueueJob("PromiseJobs", PromiseReactionJob, «‍fulfillReaction, value»)
  2. 否则，如果promise的[[PromiseState]]内部插槽的值为"rejected"，
    a.设原因为promise的[[PromiseResult]]内部槽的值
    b.执行EnqueueJob("PromiseJobs", PromiseReactionJob, «‍rejectReaction, reason»)

因此，当promise被解析或拒绝时，相应的回调将被安排在稍后与当前执行异步运行。

参考文献：

  • 25.4.5.3.1 PerformPromiseThen ( promise, onFulfilled, onRejected, resultCapability )
  • 8.4.1 EnqueueJob (queueName, job, arguments)

第二个侦听器不依赖于第一个侦听器（promise），因此它们异步工作。为什么要把它们分开？您可以简单地使用以下代码

    Promise
        .resolve()
        .then(function(){
            throw 'first';
        })
        .catch(function(er){
            console.log(er);
        })
        .finally(function(er) {
            console.log('second');
        };
    });
相关文章：