reduce是JavaScript数组将元素累积为单一值的方法,通过callback(含累计值acc和当前项cur)和可选initialValue实现;常用于聚合计算、结构转换、分组等,需注意初始值类型匹配与必返值。

reduce 是 JavaScript 数组的高阶方法,它把数组“折叠”成一个单一值——不是简单遍历,而是持续累积计算:每次用上一次的结果和当前元素做运算,最终返回那个累积值。
核心机制:靠两个关键参数驱动
调用形式是 arr.reduce(callback, initialValue):
-
callback 接收四个参数,常用前两个:累计值(acc)和当前项(cur)。第一次调用时,acc 默认是数组第一个元素,cur 是第二个;如果传了
initialValue,acc 就从它开始,cur 从第一个元素起 - initialValue 可选但强烈建议显式传入。不传时,空数组会报错;类型不匹配(比如想求和却没给初始数字 0)也容易出 bug
典型应用场景:远不止求和统计
只要问题能抽象为“逐个处理、不断合并”,reduce 就很合适:
-
聚合计算:求和、乘积、最大值、平均值。例如
[2, 4, 6].reduce((sum, n) => sum + n, 0)得 12 -
数据结构转换:把数组转成对象(如按 id 索引)、扁平化嵌套数组、过滤+映射一步到位。例如
arr.reduce((obj, item) => ({ ...obj, [item.id]: item }), {}) -
分组与分类:按条件把元素归到不同桶里。例如按奇偶分组:
nums.reduce((groups, n) => { groups[n % 2 ? 'odd' : 'even'].push(n); return groups; }, { odd: [], even: [] }) - 链式操作模拟:配合函数组合,实现类似 pipeline 的数据流处理,比如验证、转换、格式化一气呵成
容易踩的坑:逻辑清晰比炫技重要
reduce 功能强,但写错会很难调试:
立即学习“Java免费学习笔记(深入)”;
- 忘记写
return—— 累计值变成undefined,后续全崩 - 初始值类型和返回值类型不一致 —— 比如累加字符串却用数字 0 开始,结果变成
"0123" - 误以为它能替代 forEach 或 map —— 它不关心中间过程,只关注最终结果;需要副作用或新数组时,优先选更语义明确的方法
- 过度嵌套 reduce —— 三层以上就该考虑拆成多个步骤,可读性更重要
基本上就这些。用好 reduce 的关键是想清楚“我到底要累积什么”,而不是记住语法。它不复杂,但容易忽略初始值和返回逻辑的一致性。











