轻松理解 ECMAScript 的 async 和 await，让异步编程更加同步化

2023-12-12 19:35:16

ECMAScript 的 async 和 await 是两大革命性的，它们大幅简化了 JavaScript 中的异步编程。使用它们，我们可以轻松地编写出异步代码，而无需再使用回调函数或 Promise 对象。

async 函数

async 函数是一个支持异步操作的函数。当我们调用一个 async 函数时，它会返回一个 Promise 对象。如果函数执行成功，则 Promise 对象将包含函数的返回值；如果函数执行失败，则 Promise 对象将包含错误信息。

async function myAsyncFunction() {
  // 异步操作
  const result = await Promise.resolve('Hello, world!');

  // 返回结果
  return result;
}

myAsyncFunction().then((result) => {
  console.log(result); // "Hello, world!"
}).catch((error) => {
  console.error(error);
});

在上面的示例中，myAsyncFunction() 是一个 async 函数。当我们调用它时，它会返回一个 Promise 对象。该 Promise 对象将在异步操作完成后解析，并返回结果 "Hello, world!"。

await 操作符

await 操作符用于等待异步操作完成。它只能在 async 函数中使用。当我们使用 await 操作符时，它会暂停函数的执行，直到异步操作完成。一旦异步操作完成，函数的执行将继续进行。

async function myAsyncFunction() {
  // 异步操作
  const result = await Promise.resolve('Hello, world!');

  // 使用结果
  console.log(result); // "Hello, world!"
}

myAsyncFunction();

在上面的示例中，await 操作符用于等待 Promise 对象解析。一旦 Promise 对象解析，console.log() 语句就会执行，并将结果 "Hello, world!" 打印到控制台。

async 和 await 的优点

async 和 await 具有许多优点，包括：

可读性强： async 和 await 使得异步代码更加易于阅读和理解。它们可以让我们将异步代码写成同步代码的样子，从而降低了学习和维护的难度。
可维护性强： async 和 await 可以帮助我们编写出更具可维护性的代码。它们可以让我们避免使用回调函数和 Promise 对象，从而减少了代码中的嵌套和复杂性。
提高性能： async 和 await 可以帮助我们提高代码的性能。它们可以让我们避免使用回调函数和 Promise 对象，从而减少了代码的执行时间。