关于这段代码执行顺序的问题

Question

所以这些天我一直在阅读有关 Javascript 承诺的教程。

这是一个例子，用于解释宏任务队列（即事件循环）和微任务队列。

let promise = Promise.reject(new Error("Promise Failed!"));
promise.catch(err => alert('caught'));

// no error, all quiet
window.addEventListener('unhandledrejection', event => alert(event.reason));

它说因为promise.catch 捕获了错误，所以最后一行，事件处理程序永远不会运行。我可以理解这一点。但后来他稍微调整了这个例子。

let promise = Promise.reject(new Error("Promise Failed!"));
setTimeout(() => promise.catch(err => alert('caught')));

// Error: Promise Failed!
window.addEventListener('unhandledrejection', event => alert(event.reason));

这次他说事件处理程序将首先运行并捕获错误，之后promise.catch最终捕获错误。

我不明白第二个例子是，为什么事件处理程序在promise.catch 之前运行？

我的理解是，

1. 第一行，我们首先遇到一个promise，我们把它放到微任务队列中。
2. 第二行，我们有一个setTimeout，我们把它放到宏任务队列中，
3. 第三行，我们有一个事件处理程序，我们将处理程序放在等待被触发的宏任务队列中

那么，因为微任务的优先级高于宏任务。我们首先运行承诺。之后，我们将宏任务队列中的第一个任务出列，即setTimeout。所以根据我的理解，错误应该被setTimeout里面的函数捕获。

请纠正我。

Answer 1

您对第 3 步的理解是错误的）。处理程序将同步添加。然后微任务队列开始运行，promise 被拒绝。由于尚未添加 .catch 处理程序，因此会抛出未处理的拒绝。

我认为您在添加回调时和执行回调时混为一谈。考虑这种情况：

  (new Promise).then(function callback() { });

回调将被同步添加，但永远不会被调用，因为承诺永远不会解决。在这种情况下：

  Promise.resolve().then(function callback() { });

回调再次被同步添加，但承诺解决发生在微任务中，因此回调将在稍后执行。