使用 async/await 解决 Promise 中的异常-JavaScript中文网-JavaScript教程资源分享门户

异步编程中，Promise 经常用于处理异步操作并返回结果。在 Promise 中，使用 then() 和 catch() 方法来处理成功和失败的情况。但是，如果 Promise 链中存在多个异步操作，并且其中一个出错了，将会造成代码难以维护和调试。而 async/await 是一种更加优雅的异步编程方式，它能够帮助我们处理 Promise 中的异常，从而使代码更加可读、可维护。

Promise 中的异常

在 Promise 中，当一个 Promise 抛出异常时，它会返回一个被拒绝的 Promise。被拒绝的 Promise 可以通过 Promise.prototype.catch() 方法来捕获异常并进行处理。例如：

// www.javascriptcn.com code example
fetch(url)
  .then(response => {
    if (response.ok) {
      return response.json();
    } else {
      throw new Error('Network response error');
    }
  })
  .then(data => {
    // 处理数据
  })
  .catch(error => {
    // 处理异常
  });

在上述代码中，如果 fetch() 方法返回的响应 status 不是 200，将会抛出一个错误，然后被捕获并处理。

但是，当 Promise 链中存在多个异步操作时，错误处理就变得更加困难了。例如：

// www.javascriptcn.com code example
fetch(url)
  .then(response => {
    if (response.ok) {
      return response.json();
    } else {
      throw new Error('Network response error');
    }
  })
  .then(data => {
    // 发送请求
    return fetch(anotherUrl);
  })
  .then(response => {
    if (response.ok) {
      return response.json();
    } else {
      throw new Error('Network response error');
    }
  })
  .then(data => {
    // 处理数据
  })
  .catch(error => {
    // 处理异常
  });

在上述代码中，当第二个 fetch() 方法返回一个被拒绝的 Promise 时，异常将会一直向下传递，直到被捕获。这种方式会导致代码的可读性变差，因为我们需要在每个 then() 方法中都手动处理异常。

使用 async/await 处理异常

async/await 是一种更加优雅的异步编程方式，它能够帮助我们处理 Promise 中的异常。使用 async/await，我们可以在代码中使用 try/catch 语句来捕获异常。例如：

// www.javascriptcn.com code example
try {
  const response1 = await fetch(url);
  if (!response1.ok) {
    throw new Error('Network response error');
  }
  const data1 = await response1.json();
  
  const response2 = await fetch(anotherUrl);
  if (!response2.ok) {
    throw new Error('Network response error');
  }
  const data2 = await response2.json();
  
  // 处理数据
} catch (error) {
  // 处理异常
}

在上述代码中，使用 await 关键字可以将异步操作执行顺序化，从而保证代码的可读性。如果某个异步操作出错了，异常将会被捕获并执行 catch 块中的代码。

需要注意的是，在使用 async/await 时，如果某个操作返回一个被拒绝的 Promise，它将会抛出一个异常。因此，我们仍然需要使用 try/catch 语句来捕获这些异常。

指南

使用 async/await 可以让代码更加优雅和可读，从而提高开发效率。以下是一些使用 async/await 的指南：

使用 try/catch 语句来捕获异常；
在异步操作之前使用 await 关键字来等待操作完成；
使用 Promise.all() 来同时执行多个异步操作，并等待它们全部完成；
不要忘记处理被拒绝的 Promise。

示例代码

以下是一个例子，它使用 async/await 来同时执行多个异步操作：

// www.javascriptcn.com code example
async function fetchData() {
  try {
    const [data1, data2] = await Promise.all([fetchData1(), fetchData2()]);
    // 处理数据
  } catch (error) {
    // 处理异常
  }
}

async function fetchData1() {
  const response = await fetch(url);
  if (!response.ok) {
    throw new Error('Network response error');
  }
  return response.json();
}

async function fetchData2() {
  const response = await fetch(anotherUrl);
  if (!response.ok) {
    throw new Error('Network response error');
  }
  return response.json();
}

在上述代码中，我们使用 Promise.all() 来同时执行两个异步操作。如果其中一个操作失败了，异常将会被捕获并执行 catch 块中的代码。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/67d747cba941bf7134d253a1

使用 async/await 解决 Promise 中的异常

Promise 中的异常

使用 async/await 处理异常

指南

示例代码

接着读