async awaitasync 和 await 是 JavaScript 中用于处理异步操作的强大工具。它们使得异步代

async 和 await 是 JavaScript 中用于处理异步操作的强大工具。它们使得异步代码看起来更像同步代码，从而简化了异步编程的复杂性。下面详细介绍 async 和 await 的基本概念、语法和用法。

1. 基本概念

async：用于声明一个函数为异步函数。
await：用于等待一个 Promise 完成（解析或拒绝），并且只能在 async 函数内部使用。

2. 语法

`async` 函数

async 函数返回一个 Promise 对象。如果函数内部没有使用 await，则返回一个解析的 Promise；如果有 await，则根据 await 的结果来决定返回的 Promise 的状态。

`await` 表达式

await 表达式用于等待一个 Promise 完成。如果 Promise 解析，则 await 表达式的值就是 Promise 的解析值；如果 Promise 被拒绝，则会抛出一个异常。

3. 示例代码

示例 1：基本用法

javascript
// 异步函数
async function fetchData() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

// 调用异步函数
fetchData()
  .then(data => console.log(data))
  .catch(error => console.error(error));

示例 2：处理错误

javascript
// 异步函数
async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    const data = await response.json();
    return data;
  } catch (error) {
    console.error('Fetch failed:', error);
  }
}

// 调用异步函数
fetchData().then(data => console.log(data));

4. 多个 `await` 表达式

在 async 函数内部可以有多个 await 表达式，每个 await 表达式都会等待前一个 Promise 完成后再继续执行。

示例 3：多个 `await` 表达式

javascript
async function processData() {
  try {
    const response1 = await fetch('https://api.example.com/data1');
    const data1 = await response1.json();

    const response2 = await fetch('https://api.example.com/data2');
    const data2 = await response2.json();

    console.log(data1, data2);
  } catch (error) {
    console.error('Processing failed:', error);
  }
}

processData();

5. 并行处理

使用 Promise.all 可以并行处理多个异步操作。

示例 4：并行处理

javascript
async function fetchDataParallel() {
  try {
    const [response1, response2] = await Promise.all([
      fetch('https://api.example.com/data1'),
      fetch('https://api.example.com/data2')
    ]);

    const [data1, data2] = await Promise.all([
      response1.json(),
      response2.json()
    ]);

    console.log(data1, data2);
  } catch (error) {
    console.error('Parallel fetching failed:', error);
  }
}

fetchDataParallel();

6. 返回值和错误处理

返回值：async 函数返回一个 Promise，这个 Promise 的解析值是 async 函数的返回值。
错误处理：如果 async 函数内部抛出了异常，那么返回的 Promise 会被拒绝。

示例 5：返回值和错误处理

javascript
async function exampleAsync() {
  try {
    const result = await fetch('https://api.example.com/data');
    const data = await result.json();
    return data;
  } catch (error) {
    throw new Error('Failed to fetch data');
  }
}

exampleAsync()
  .then(data => console.log(data))
  .catch(error => console.error(error));

总结

async 和 await 是 JavaScript 中处理异步操作的强大工具，它们简化了异步编程的复杂性，使得异步代码看起来更像同步代码。主要特点包括：

async 用于声明异步函数，返回一个 Promise。
await 用于等待一个 Promise 完成，只能在 async 函数内部使用。
错误处理通常使用 try...catch 结构来捕获和处理异常。

通过合理使用 async 和 await，可以使异步代码更加简洁和易读，同时提高代码的可维护性。

async await