JavaScript async/await 异常处理：try-catch 与 .catch() 对比

• 使用 try-catch 是可行的方案，操作相对便捷。
• 利用 .catch() 方法同样可以处理异常。
• 将 .catch() 与解构赋值结合使用，代码风格更为优雅。

在 async/await 函数中，可以通过 try-catch 结构来捕获异步操作抛出的错误，并在 catch 分支中进行相应的逻辑处理。

以下代码展示了在 async/await 函数中应用 try-catch 处理异常的实例：

async function fetchData() {
  try {
    const response = await fetch("https://api.example.com/data");
    if (!response.ok) {
      throw new Error("Request failed");
    }
    const data = await response.json();
    return data;
  } catch (error) {
    console.error("Error:", error);
    throw error; // 可以选择重新抛出异常
  }
}
async function process() {
  try {
    const result = await fetchData();
    console.log("Result:", result);
  } catch (error) {
    console.error("Error:", error);
  }
}
process();

上述示例中，fetchData 是一个异步函数，内部通过 await 等待 fetch 接口返回的 Promise。若请求状态码非成功（response.ok 为 false），则通过 throw 主动抛出错误。在 catch 块中，可以捕获该错误并执行后续操作，例如打印错误日志或重新抛出异常。

在 process 函数内部，利用 try-catch 结构来捕获 fetchData 可能引发的异常。一旦 fetchData 抛出错误，该错误便会在 process 的 catch 块中被捕获并处理。

需注意的是，若在 async/await 函数中未使用 try-catch 包裹，异步操作抛出的错误会被包装为一个被拒绝（rejected）的 Promise。此时，可以在调用该 async 函数时链式调用 .catch() 方法来捕获此错误。

async/await 语法提供了更直观简洁的异步处理方案，配合 try-catch 使用能有效提升代码的可读性与可维护性。

在 async/await 场景中，可以结合 .catch() 方法与解构赋值（Destructuring Assignment）来实现异常处理。

以下示例演示了如何结合解构赋值与 .catch() 方法处理异常：

async function fetchData() {
  const response = await fetch("https://api.example.com/data");
  if (!response.ok) {
    throw new Error("Request failed");
  }
  const data = await response.json();
  return data;
}
async function process() {
  try {
    const result = await fetchData();
    console.log("Result:", result);
  } catch ({ message }) {
    console.error("Error:", message);
  }
}
process().catch(error => {
  console.error("Unhandled error:", error);
});

示例中，fetchData 为异步函数，内部使用 await 等待 fetch 返回的 Promise。若请求失败（response.ok 为 false），则通过 throw 抛出错误。

在 process 函数中，使用 try-catch 捕获 fetchData 可能抛出的异常。在 catch 块内，通过解构赋值提取错误对象的 message 属性，并进行相应处理。

调用 process 函数时，可链式调用 .catch() 方法来捕获未处理的异常，确保异步操作中抛出的错误能被正确捕获和处理。

通过解构赋值配合 .catch() 方法，可以更便捷地提取错误对象中的特定属性并进行处理。这种方式使代码更加简洁易读。

至此，关于 JavaScript async/await 异常处理方案的介绍结束。如需了解更多相关 JavaScript async/await 异常处理内容，请搜索本站历史文章或继续阅读后续文章，感谢支持！