js 异步操作回调函数如何控制执行顺序

在JavaScript中，控制异步操作回调函数的执行顺序，一个常用的方法是使用Promise。Promise提供了一种处理异步操作的方式，使得我们可以以更直观、更灵活的方式来控制异步操作的流程。

下面是一个使用Promise来控制异步操作执行顺序的例子：

// 假设有两个异步操作函数，分别返回一个Promise对象
function asyncOperation1() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log('异步操作1完成');
            resolve('操作1的结果');
        }, 1000); // 假设异步操作1需要1秒
    });
}

function asyncOperation2(depResult) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`异步操作2依赖于操作1的结果：${depResult}`);
            console.log('异步操作2完成');
            resolve('操作2的结果');
        }, 500); // 假设异步操作2需要0.5秒
    });
}

// 使用Promise的.then()链来控制执行顺序
asyncOperation1()
    .then(result1 => {
        console.log('操作1的结果：', result1);
        return asyncOperation2(result1); // 将操作1的结果作为参数传递给操作2
    })
    .then(result2 => {
        console.log('操作2的结果：', result2);
    })
    .catch(error => {
        console.error('发生错误：', error);
    });

// 执行顺序将是：
// 异步操作1完成
// 操作1的结果： 操作1的结果
// 异步操作2依赖于操作1的结果：操作1的结果
// 异步操作2完成
// 操作2的结果： 操作2的结果

在这个例子中，`asyncOperation1`和`asyncOperation2`都是返回Promise对象的函数。我们通过`asyncOperation1().then(...)`开始执行第一个异步操作，并在其成功完成后（即resolve被调用时），将结果作为参数传递给`asyncOperation2`，并继续通过`.then(...)`处理`asyncOperation2`的结果。这样，我们就能够确保`asyncOperation2`在`asyncOperation1`成功完成后才执行，从而控制了执行顺序。