JS之reduce函数

javascript

小白学习用的 reduce 用法总结**，分为：

• 一、reduce 是干嘛的
• 二、结构怎么写
• 三、常见用法场景（多个例子）
• 四、和 map/for 的区别
• 五、一句话记忆法

一、reduce 是干嘛的？

reduce 是数组的“归并器”，用来把一个数组变成一个值（数字、字符串、对象、数组等都可以）。

它一边遍历数组，一边累计结果。

二、reduce 语法结构

array.reduce((acc, cur, index, arr) => {
  // acc 是“累计器”，你构建的最终结果
  // cur 是当前项
  // index 是当前索引（从0开始）
  // arr 是原数组（不常用）
  return 新的acc   // 每轮 return 的 acc 会传到下一轮
}, 初始值)

三、常见例子（实用 + 简单）

例1：数组求和

const nums = [1, 2, 3, 4]

const sum = nums.reduce((acc, cur) => acc + cur, 0)
// 初始 acc = 0 → 0+1 → 1+2 → 3+3 → 6+4 = 10

console.log(sum) // 输出 10

例2：把数组拼成字符串

const words = ['我', '是', 'ChatGPT']

const sentence = words.reduce((acc, cur) => acc + cur, '')

console.log(sentence) // 输出：我是ChatGPT

例3：把数组变成对象（语言 → 翻译）

const langs = ['en', 'zh']

const translations = langs.reduce((acc, lang) => {
  acc[lang] = `${lang}翻译`
  return acc
}, {})

console.log(translations)
// 输出：{ en: 'en翻译', zh: 'zh翻译' }

例4：按年龄分类（高级一点）

const users = [
  { name: 'Tom', age: 17 },
  { name: 'Jerry', age: 21 },
  { name: 'Amy', age: 17 }
]

const groupByAge = users.reduce((acc, user) => {
  const age = user.age
  if (!acc[age]) acc[age] = []
  acc[age].push(user.name)
  return acc
}, {})

console.log(groupByAge)
// 输出：{ 17: ['Tom', 'Amy'], 21: ['Jerry'] }

四、reduce 一句话记忆法（小白口诀）

“一边循环，一边累，加到最后才返回。”

• reduce 就像你自己写的 let result = 初始值; for 循环里面 result 不断变
• 最终你 return 的 acc 就是整个 reduce 的结果

总结

array.reduce((accumulator, currentItem, index, array) => {
  // 每一轮对 acc 做处理
  return 新的acc
}, 初始值)

常用场景：

• 数组求和：[1,2,3].reduce((a,b)=>a+b, 0)
• 数组转对象：['en','zh'].reduce((acc,lang)=>{acc[lang]=xx; return acc}, {})
• 分组统计：分年龄、分城市等
• 合并字符串/结构：累加、拼接都能做