面试题：JavaScript中Promise的错误处理机制

Question

请描述JavaScript中Promise的错误处理方式，如何捕获Promise链中某个环节的错误？请举例说明.then()和.catch()在错误处理中的用法及区别。

Answer 1

Promise的错误处理方式

1. 在.then()中处理：.then()接收两个回调函数，第一个处理成功结果，第二个处理错误。例如：

const promise = new Promise((resolve, reject) => {
  reject('出错了');
});
promise.then(
  value => console.log('成功:', value),
  error => console.log('错误:', error)
);

2. 使用.catch()处理：.catch()专门用于捕获Promise链中前面环节抛出的错误。例如：

const promise = new Promise((resolve, reject) => {
  reject('出错了');
});
promise
 .catch(error => console.log('错误:', error));

捕获Promise链中某个环节的错误

在Promise链中，如果某个.then()中返回的Promise被拒绝，或者在.then()的成功回调函数中抛出错误，后续的.catch()会捕获到该错误。例如：

const promise = new Promise((resolve, reject) => {
  resolve('初始值');
});
promise
 .then(value => {
    // 模拟抛出错误
    throw new Error('处理过程中出错');
  })
 .then(newValue => console.log('这个不会执行', newValue))
 .catch(error => console.log('捕获到错误:', error.message));

.then()和.catch()在错误处理中的用法及区别

• 用法：
  • .then()的第二个回调函数用于处理当前Promise的错误。
  • .catch()用于捕获Promise链中前面环节抛出的错误。
• 区别：
  • 位置：.then()的错误处理回调与成功处理回调紧密相连，在同一个.then()中；而.catch()通常在Promise链的末尾，统一捕获前面环节的错误。
  • 职责：.then()侧重于处理当前Promise的结果，无论是成功还是失败；.catch()专注于捕获整个Promise链中未被处理的错误，提供集中的错误处理机制。
  • 可读性：.catch()使错误处理逻辑更清晰，尤其是在复杂的Promise链中，将错误处理与正常逻辑分离，提高代码的可读性和可维护性。