为什么同一个 Promise 会调用两次 catch 函数？

Question

我试图理解 JS 中的 Promise 是如何工作的，并面对这个例子：

const promise = Promise.reject();

promise
  .catch(() => console.log(1));
  
promise
  .catch(() => console.log(2));

// Output:
// 1
// 2

const promise = Promise.reject();

promise
  .catch(() => console.log(1))
  .catch(() => console.log(2));

// Output:
// 1

为什么相似的例子会有不同的输出？ 为什么在第一个示例中

catch

被第二次调用？ 因为在第一次 catch 后 Promise 已经被拒绝，所以在这两种情况下都不应该调用第二次 catch 应该是合乎逻辑的...... 我认为这里的主要原因是微任务队列如何工作，但我不确定。

Answer 1

此行为是由于微任务队列以及 JavaScript 中 Promise 链的工作方式造成的。 在第一个例子中 Promise.reject() 创建一个被拒绝的 Promise。这会立即调度附加到微任务队列中的 Promise 的 catch 处理程序，以便在当前同步代码完成后执行。

promise.catch(() => console.log(1));

这会为第一个 catch 处理程序安排一个微任务来处理拒绝并记录 1。 Promise.catch(() => console.log(2));

这会为第二个 catch 处理程序安排另一个微任务来处理相同的拒绝并记录 2

在第二个例子中 Promise.reject() 创建一个被拒绝的 Promise。拒绝计划由第一个 catch 处理程序在微任务队列中处理。

promise.catch(() => console.log(1))

第一个捕获物与承诺相关。当此处处理拒绝并记录 1 时，此 catch 返回的 Promise 变为已解决的 Promise。 .catch(() => console.log(2))

此 catch 附加到前一个 catch 返回的承诺中。由于之前的 catch 已经解决了 Promise，因此不会触发此 catch。