JavaScript 异步模式

JavaScript 异步编程模式是现代前端开发中不可或缺的一部分。它允许我们在等待某些操作（如网络请求）完成时执行其他任务，从而提高应用程序的性能和响应性。以下是几种常见的 JavaScript 异步模式：

回调函数
Promise
生成器
异步/await

回调函数

回调函数是最简单的异步模式。当某个异步操作完成时，它会执行一个回调函数。

function fetchData(callback) {
    setTimeout(() => {
        callback('数据已获取');
    }, 1000);
}

fetchData(data => {
    console.log(data);
});

Promise

Promise 是一个对象，它代表了异步操作最终完成（或失败）的状态。它有一个 then 方法，可以用来处理成功的情况，以及一个 catch 方法用来处理失败的情况。

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

fetchData()
    .then(data => {
        console.log(data);
    })
    .catch(error => {
        console.error(error);
    });

生成器

生成器是函数的一种特殊形式，允许你通过 yield 关键字暂停函数的执行，并在适当的时候恢复。

function* fetchData() {
    yield '数据一';
    yield '数据二';
    yield '数据三';
}

const generator = fetchData();
console.log(generator.next().value); // 数据一
console.log(generator.next().value); // 数据二
console.log(generator.next().value); // 数据三

异步/await

异步/await 允许你使用类似同步的方式编写异步代码。它是基于 Promise 的。

async function fetchData() {
    const data = await fetch('/data');
    return data.json();
}

fetchData()
    .then(data => {
        console.log(data);
    })
    .catch(error => {
        console.error(error);
    });

以上是几种常见的 JavaScript 异步模式。了解并掌握这些模式对于前端开发者来说至关重要。