async/await 异步编程

async/await 是 JavaScript 中用于处理异步操作的强大语法，它建立在 Promise 的基础之上，让异步代码看起来更像是同步代码，提高了代码的可读性和可维护性。以下是详细的知识点、丰富的例子以及常用方法：

1. async 函数

async 是一个关键字，用于定义异步函数。异步函数总是返回一个 Promise 对象。如果函数内部没有显式地返回一个 Promise，那么会返回一个已解决（resolved）状态的 Promise，其值为函数的返回值。

示例：

async function asyncFunction() {
    return '这是一个异步函数的返回值';
}

const resultPromise = asyncFunction();
console.log(resultPromise instanceof Promise); // true
resultPromise.then(value => console.log(value)); // 输出: 这是一个异步函数的返回值

2. await 表达式

await 只能在 async 函数内部使用。它会暂停 async 函数的执行，直到其等待的 Promise 被解决（resolved）或被拒绝（rejected）。当 Promise 被解决时，await 表达式会返回 Promise 的解决值；当 Promise 被拒绝时，会抛出异常。

示例：

function fetchData() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve('数据已获取');
        }, 1000);
    });
}

async function getData() {
    const data = await fetchData();
    console.log(data); // 输出: 数据已获取
    return data;
}

getData();

3. 错误处理

在 async/await 中，通常使用 try...catch 语句来捕获和处理异步操作中抛出的异常。

示例：

function fetchDataWithError() {
    return new Promise((_, reject) => {
        setTimeout(() => {
            reject('数据获取失败');
        }, 1000);
    });
}

async function getDataWithError() {
    try {
        const data = await fetchDataWithError();
        console.log(data);
    } catch (error) {
        console.error('捕获到错误:', error);
    }
}

getDataWithError();

4. 多个异步操作的顺序执行

当有多个 async 操作需要顺序执行时，可以在 async 函数中依次使用多个 await 表达式。

示例：

function step1() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve('步骤1完成');
        }, 1000);
    });
}

function step2() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve('步骤2完成');
        }, 1000);
    });
}

async function executeSteps() {
    const result1 = await step1();
    console.log(result1);
    const result2 = await step2();
    console.log(result2);
}

executeSteps();

5. 多个异步操作的并发执行

可以使用 Promise.all 方法来实现多个异步操作的并发执行，然后在 async 函数中使用 await 等待所有 Promise 都完成。

示例：

function task1() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve('任务1完成');
        }, 1500);
    });
}

function task2() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve('任务2完成');
        }, 1000);
    });
}

async function executeTasks() {
    const [result1, result2] = await Promise.all([task1(), task2()]);
    console.log(result1);
    console.log(result2);
}

executeTasks();

6. 常用方法总结

• Promise.all：接受一个 Promise 数组作为参数，当所有 Promise 都成功时，返回一个包含所有 Promise 解决值的数组；只要有一个 Promise 失败，整个 Promise.all 就会失败。
• Promise.race：接受一个 Promise 数组作为参数，只要数组中有一个 Promise 率先解决或拒绝，就返回该 Promise 的结果。
• try...catch：用于捕获 async 函数中 await 表达式可能抛出的异常，进行错误处理。

通过 async/await 结合这些方法，可以灵活地处理各种复杂的异步场景，使异步代码更加简洁和易于理解。