尝试捕获异步等待 - Javascript

在Javascript中，异步编程经常出现。这是因为它可以使应用程序在执行单调操作时不被阻塞。但是，这也使得编写可读且可管理的代码变得更加困难，因为代码执行顺序不再像同步代码那样明确。为了解决这个问题，Javascript引入了Promise和async/await概念。

Promise

Promise是一种异步编程模式，用于处理Javascript代码中的异步操作。Promise表示可能还没有完成的操作的结果或错误，但将来可能会完成。Promise有三个状态：pending，fulfilled和rejected。在创建Promise时，代码可以指定在这些状态中的哪一个状态下进行处理。

当Promise处于pending状态时，它表示还没有完成的操作，并且可以在稍后的时间中更改为fulfilled或rejected状态。当Promise处于fulfilled状态时，它表示已经完成的操作。当Promise处于rejected状态时，它表示操作失败。下面是一个简单的Promise示例：

const myPromise = new Promise((resolve, reject) => {
  const randNum = Math.floor(Math.random() * 10);
  if (randNum % 2 === 0) {
    resolve('Promise is fulfilled!');
  } else {
    reject(new Error('Promise is rejected!'));
  }
});

myPromise
  .then((result) => console.log(result))
  .catch((error) => console.error(error.message));

在上面的示例中，myPromise是一个Promise对象。Promise构造函数接收一个参数来执行异步操作。如果操作成功，则结果将通过resolve函数返回；如果操作失败，则错误将通过reject函数返回。最后，代码使用then和catch方法来处理Promise对象的结果和错误。

Async/await

async/await是一种异步编程模式，它建立在Promise之上，使Javascript代码更加易于阅读和管理。使用async/await，可以将异步操作视为同步操作进行编写。

async函数返回一个Promise对象，可以使用await关键字暂停代码，直到一个操作完成并返回结果。下面是一个简单的async/await例子：

const myPromise = (ms) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve(`Promise resolved after ${ms}ms`), ms);
  });
};

async function asyncFn() {
  try {
    const result1 = await myPromise(1000);
    console.log(result1);
    const result2 = await myPromise(2000);
    console.log(result2);
    const result3 = await myPromise(3000);
    console.log(result3);
  } catch (error) {
    console.error(error);
  }
}

asyncFn();

在上述例子中，myPromise函数模拟异步操作，并在指定的时间（以毫秒为单位）解决Promise。async函数asyncFn使用await关键字来暂停代码，以便在解决每个Promise对象之前等待。由于asyncFn在返回之前返回一个Promise对象，因此可以使用.then和.catch方法处理结果与异常。

捕获异步等待

当使用async/await编写异步代码时，捕获异步等待是很重要的。因为await会阻塞代码执行，如果不正确地捕获异步等待，整个应用程序可能会停止响应。下面是一个示例，说明如何正确捕获异步等待：

async function asyncFn() {
  try {
    const result = await fetch('https://jsonplaceholder.typicode.com/todos/1');
    const json = await result.json();
    console.log(`UserId: ${json.userId}, Title: ${json.title}`);
  } catch (error) {
    console.error(error);
  }
}

asyncFn();

在上述示例中，asyncFn函数使用await关键字执行fetch请求并返回结果。在解析JSON结果之前，代码阻塞，等待fetch结果。使用try-catch块来捕获可能发生的异常，例如网络错误或响应未包含预期数据的情况。如果有异常发生，则代码将在catch块中执行错误处理逻辑。如果没有异常，则代码将在try块中解析JSON数据。

结论

使用Promise和async/await，可以轻松地编写Javascript异步代码，并使代码更具可读性和可维护性。捕获异步等待很重要，因为它可以防止Javascript代码长时间阻塞，并使应用程序失去响应。