Promise 在错误处理方面非常出色。当 promise 拒绝时，控件跳转到最近的拒绝处理程序。这在实践中很方便。

例如，下面的代码中获取的URL是错误的(没有这样的站点)，.catch处理错误:

fetch('https://no-such-server.blabla') // rejects
  .then(response => response.json())
  .catch(err => alert(err)) // TypeError: failed to fetch (the text may vary)

如您所见，.catch不一定是即时的。它可能出现在一个或几个 .then。

或者，可能站点一切正常，但响应不是有效的JSON。捕获所有错误的最简单方法是将.catch添加到chain的末尾:

fetch('/article/promise-chaining/user.json')
  .then(response => response.json())
  .then(user => fetch(`https://api.github.com/users/${user.name}`))
  .then(response => response.json())
  .then(githubUser => new Promise((resolve, reject) => {
    let img = document.createElement('img');
    img.src = githubUser.avatar_url;
    img.className = "promise-avatar-example";
    document.body.append(img);

    setTimeout(() => {
      img.remove();
      resolve(githubUser);
    }, 3000);
  }))
  .catch(error => alert(error.message));

通常，这种 .catch根本不会触发。但是，如果上面的任何一个 Promise 被拒绝(网络问题或无效的json或其他什么)，那么它就会捕获它。

隐式 try catch

Promise 执行程序和 Promise 处理程序的代码有一个“不可见的 try..catch。如果发生了异常，它会被捕获并作为拒绝处理。

例如，以下代码:

new Promise((resolve, reject) => {
  throw new Error("Whoops!");
}).catch(alert); // Error: Whoops!

工作原理完全一样:

new Promise((resolve, reject) => {
  reject(new Error("Whoops!"));
}).catch(alert); // Error: Whoops!

“看不见的try..catch,执行程序会自动捕获错误并将其转换为被拒绝的Promise。

这不仅发生在executor函数中，也发生在其处理程序中。如果我们抛出一个.then处理程序，这意味着一个被拒绝的承诺，因此控件跳转到最近的错误处理程序。

这里有一个例子:

new Promise((resolve, reject) => {
  resolve("ok");
}).then((result) => {
  throw new Error("Whoops!"); // rejects the promise
}).catch(alert); // Error: Whoops!

所有错误都会发生这种情况，而不仅仅是由throw语句引起的错误。例如，一个编程错误:

new Promise((resolve, reject) => {
  resolve("ok");
}).then((result) => {
  blabla(); // no such function
}).catch(alert); // ReferenceError: blabla is not defined

最后的.catch不仅能捕获显式的拒绝，还能捕获上述处理程序中的意外错误。

Rethrowing

正如我们已经注意到的，.catch在链的末端类似于try..catch。我们可以有任意多的.then处理程序，然后在末尾使用一个.catch来处理所有处理程序中的错误。

在定期的尝试中…我们可以分析错误，如果不能处理，可能会重新抛出错误。同样的事情也可能发生在承诺上。

如果我们在.catch中抛出，那么控件将转到下一个最近的错误处理程序。如果我们处理错误并正常完成，那么它会继续到下一个成功的。then handler。

在下面的例子中，.catch成功地处理了错误:

// the execution: catch -> then
new Promise((resolve, reject) => {

  throw new Error("Whoops!");

}).catch(function(error) {

  alert("The error is handled, continue normally");

}).then(() => alert("Next successful handler runs"));

在这里，.catch块正常完成。因此，调用下一个成功的.then处理程序。

在下面的例子中，我们将看到.catch的另一种情况。处理程序(*)捕获了错误，但无法处理它(例如，它只知道如何处理URIError)，所以它再次抛出它:

// the execution: catch -> catch
new Promise((resolve, reject) => {

  throw new Error("Whoops!");

}).catch(function(error) { // (*)

  if (error instanceof URIError) {
    // handle it
  } else {
    alert("Can't handle such error");

    throw error; // throwing this or another error jumps to the next catch
  }

}).then(function() {
  /* doesn't run here */
}).catch(error => { // (**)

  alert(`The unknown error has occurred: ${error}`);
  // don't return anything => execution goes the normal way

});

执行过程从第一个.catch(*)跳转到下一个。catch(**)。

Unhandled rejections

当错误没有被处理时会发生什么?例如，我们忘记将.catch添加到链的末尾，就像这样:

new Promise(function() {
  noSuchFunction(); // Error here (no such function)
})
  .then(() => {
    // successful promise handlers, one or more
  }); // without .catch at the end!

在出现错误的情况下，承诺被拒绝，执行应该跳转到最近的拒绝处理程序。但是没有。所以错误被“卡住”了。没有代码来处理它。

在实践中，就像代码中的常规未处理错误一样，这意味着某些东西出现了严重的错误。

如果出现了常规错误，但是try..catch没有捕捉到，会发生什么情况?脚本在控制台中结束，并显示一条消息。类似的事情也会发生在未经处理的拒绝承诺上。

JavaScript引擎会跟踪这种拒绝并在这种情况下生成一个全局错误。如果运行上面的示例，就可以在控制台中看到它。

在浏览器中，我们可以使用unhandledrejection事件来捕获这样的错误:

window.addEventListener('unhandledrejection', function(event) {
  // the event object has two special properties:
  alert(event.promise); // [object Promise] - the promise that generated the error
  alert(event.reason); // Error: Whoops! - the unhandled error object
});

new Promise(function() {
  throw new Error("Whoops!");
}); // no catch to handle the error

事件是HTML标准的一部分。

如果发生了错误，但是没有.catch, unhandledrejection处理程序就会触发，并获取带有错误信息的事件对象，因此我们可以做一些事情。

通常这种错误是不可恢复的，所以我们最好的解决方法是通知用户这个问题，并可能向服务器报告这个事件。

在非浏览器环境中，如Node。还有其他方法可以跟踪未处理的错误。