Promise 高级技巧：使用 Promise 实现顺序执行（azu/promises-book 解析）

Promise 高级技巧：使用 Promise 实现顺序执行（azu/promises-book 解析）

前言

在现代 JavaScript 开发中，Promise 是处理异步操作的重要工具。大多数开发者都熟悉 Promise.all 这样的并行处理方法，但实际开发中我们常常需要处理顺序执行的异步任务。本文将深入探讨如何使用 Promise 实现优雅的顺序执行方案。

顺序执行的需求场景

想象以下场景：

1. 需要依次调用多个 API，每个 API 调用依赖于前一个调用的结果
2. 批量处理文件，但需要控制同时处理的文件数量
3. 执行数据库迁移脚本，必须按特定顺序执行

这些场景下，简单的 Promise.all 就无法满足需求了，我们需要顺序执行（sequential execution）的解决方案。

基础方案：then 链式调用

最直观的解决方案是使用 then 的链式调用：

function main() {
    return Promise.resolve()
        .then(requestA)
        .then(requestB)
        .then(requestC);
}

这种写法的优点是简单直接，但缺点也很明显：

• 当任务数量增加时，代码会变得冗长
• 难以动态调整任务顺序
• 难以复用任务处理逻辑

进阶方案：循环处理

为了更灵活地处理动态任务列表，我们可以使用循环结构：

function main(tasks) {
    let promise = Promise.resolve();
    const results = [];
    
    tasks.forEach(task => {
        promise = promise
            .then(() => task())
            .then(result => results.push(result));
    });
    
    return promise.then(() => results);
}

这种方案解决了动态任务的问题，但仍然存在一些不足：

• 需要手动管理 promise 变量
• 代码结构不够简洁
• 错误处理需要额外注意

优雅方案：使用 Array.reduce

更优雅的解决方案是利用数组的 reduce 方法：

function sequenceTasks(tasks) {
    return tasks.reduce((promise, task) => {
        return promise.then(results => {
            return task().then(result => {
                results.push(result);
                return results;
            });
        });
    }, Promise.resolve([]));
}

这种写法的优势在于：

1. 不需要显式管理 promise 状态
2. 代码更加函数式，更简洁
3. 自动收集所有结果
4. 错误处理统一

实现细节解析

让我们深入分析 reduce 方案的实现细节：

1. 初始值：Promise.resolve([]) 作为初始值，确保第一次执行时有正确的上下文
2. 累积过程：每次迭代都返回一个新的 Promise，形成链式调用
3. 结果收集：将每个任务的结果收集到数组中，并传递给下一个迭代
4. 错误传播：任何任务的失败都会中断整个链条

最佳实践建议

在实际项目中，建议：

1. 封装公用函数：将顺序执行逻辑封装为可复用的工具函数
2. 明确任务定义：确保每个任务都是返回 Promise 的函数
3. 合理控制并发：对于需要限制并发数的场景，可以结合本章技巧与并发控制
4. 考虑使用 async/await：现代 JavaScript 中，async/await 语法可以更直观地表达顺序执行

与其他方案的对比

| 方案 | 优点 | 缺点 | |------|------|------| | then链式调用 | 简单直观 | 难以处理动态任务 | | 循环处理 | 可处理动态任务 | 代码略显冗长 | | reduce方案 | 简洁优雅 | 初次理解有难度 | | async/await | 最直观 | 需要现代环境支持 |

实际应用示例

以下是一个更完整的实际应用示例：

// 模拟API请求
const fetchUser = id => 
    new Promise(resolve => 
        setTimeout(() => resolve({id, name: `User ${id}`}), 100)
    );

// 任务列表
const userIds = [1, 2, 3, 4, 5];
const tasks = userIds.map(id => () => fetchUser(id));

// 顺序执行
sequenceTasks(tasks)
    .then(users => console.log('All users:', users))
    .catch(error => console.error('Error:', error));

总结

Promise 的顺序执行是异步编程中的重要模式。通过本文介绍的几种方案，特别是 reduce 方案，开发者可以优雅地处理需要顺序执行的异步任务。理解这些模式的实现原理，有助于我们在实际项目中做出更合理的技术选型。

记住，没有绝对最好的方案，只有最适合当前场景的方案。根据项目的具体需求和团队的技术栈，选择最合适的实现方式才是明智之举。