异步 Promise 以及 Async / Await —— 重新审视“错误”的传递

2024-02-19 16:25:25

在 JavaScript 中使用 Promise 和 Async/Await 有效处理错误

在现代 Web 开发中，异步编程无处不在。处理异步任务的两种常见工具是 Promise 和 Async/Await。虽然两者都能简化代码，但它们的错误传递机制却存在差异，这可能会让开发者感到困惑。本文将深入探讨 Promise 和 Async/Await 的错误处理，揭示它们的优先级和差异，帮助你编写更健壮的异步代码。

Promise 的错误传递机制

Promise 是 JavaScript 中表示异步操作结果的对象。它有三种状态：待定 (pending)、已完成 (fulfilled) 和已拒绝 (rejected)。当异步操作完成时，Promise 会进入 fulfilled 状态，携带结果值。如果操作失败，它会进入 rejected 状态，携带错误信息。

处理 Promise 的最常见方式是使用 then() 方法。此方法有两个参数：一个用于处理已完成状态的回调函数，另一个用于处理已拒绝状态的回调函数。当 Promise 进入已完成状态时，会调用第一个回调函数，并将结果值传递给它。如果它进入已拒绝状态，则会调用第二个回调函数，并将错误信息传递给它。

代码示例：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Hello, world!');
  }, 2000);
});

promise.then((result) => {
  console.log(result); // 输出: 'Hello, world!'
}, (error) => {
  console.log(error); // 不会被调用
});

Async/Await 的错误传递机制

Async/Await 是 ES2017 中引入的语法糖，它允许你使用同步的方式编写异步代码。它本质上是对 Promise 的封装，用更简洁的语法简化了异步编程。

使用 Async/Await 时，try...catch 块用于处理错误。当异步操作抛出错误时，它会被捕获，并由 catch 块处理。

代码示例：

async function sayHello() {
  try {
    const result = await new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('Hello, world!');
      }, 2000);
    });
    console.log(result); // 输出: 'Hello, world!'
  } catch (error) {
    console.log(error); // 不会被调用
  }
}

sayHello();