JavaScript高阶函数指接受函数为参数或返回函数的函数;map对数组每项执行变换并返回等长新数组,reduce则将数组聚合为单个值,二者均不修改原数组。

JavaScript高阶函数是指接受函数作为参数、或返回函数作为结果的函数。map 和 reduce 是两个最常用、也最具代表性的高阶函数,它们不修改原数组,而是基于原数组生成新数据,让代码更简洁、可读性更强。
map:对每个元素做变换,返回等长新数组
map 接收一个回调函数,遍历数组每一项,把处理后的结果组成一个新数组返回。原数组保持不变。
- 回调函数默认接收三个参数:当前元素(item)、索引(index)、原数组(array),通常只用第一个
- 必须有返回值,否则新数组对应位置是 undefined
- 适合场景:格式转换(如提取对象属性)、数值计算(如乘以2)、字符串处理(如转大写)
示例:
const nums = [1, 2, 3];
const doubled = nums.map(x => x * 2); // [2, 4, 6]
const users = [{name: 'Alice'}, {name: 'Bob'}];
const names = users.map(u => u.name); // ['Alice', 'Bob']
reduce:把数组“压缩”成一个值,灵活但需注意初始值
reduce 接收一个“累加器函数”和一个可选的初始值,从左到右依次处理每个元素,最终返回单个结果(可以是数字、对象、数组、字符串等)。
- 累加器函数接收四个参数:上一次调用的返回值(accumulator)、当前元素(currentValue)、当前索引、原数组;最常用前两个
- 若未提供初始值,第一次调用时 accumulator 是数组第一个元素,currentValue 是第二个;空数组会报错
- 提供初始值更安全,尤其处理空数组或需要特定类型结果时(比如想求和,初始值设为 0)
示例:
const nums = [1, 2, 3, 4];
const sum = nums.reduce((acc, curr) => acc + curr, 0); // 10
const arr = ['a', 'b', 'c'];
const joined = arr.reduce((acc, curr) => acc + curr, ''); // 'abc'
const scores = [{score: 85}, {score: 92}, {score: 78}];
const total = scores.reduce((sum, s) => sum + s.score, 0); // 255
map 和 reduce 的关键区别
- 输出长度:map 输出与输入等长;reduce 输出固定为一个值(除非你刻意返回数组)
- 用途倾向:map 偏向“一对一”映射;reduce 偏向“聚合”(求和、计数、分组、扁平化、查找最大值等)
- 链式调用:两者常配合使用,比如先 filter 再 map 再 reduce,实现复杂数据处理逻辑
小技巧:想把二维数组扁平成一维?arr.reduce((acc, cur) => acc.concat(cur), []) 或更现代写法 arr.flat() —— 但理解 reduce 的思路有助于掌握底层逻辑。
立即学习“Java免费学习笔记(深入)”;










