Js-ReduceJavaScript reduce() 方法 1. 什么是 reduce()？ reduce() 是数

JavaScript `reduce()` 方法

1. 什么是 `reduce()`？

reduce() 是数组的方法，用于把数组中的所有元素累积成一个单一的值（如总和、平均值、对象等）。

它是最常用也最强大的数组高阶函数之一。

2. 基本语法

array.reduce(callback, initialValue)

callback：每次迭代执行的函数（必须）
initialValue：初始值（强烈推荐传入）

callback 函数格式

array.reduce((accumulator, currentValue) => {
  return 新累加结果;
}, initialValue)

3. 参数详解

参数	名称	说明	是否必须
`accumulator`	累加器	上一次返回的结果（核心！）	是
`currentValue`	当前元素	当前正在处理的数组元素	是
`initialValue`	初始值	第一次累加时的起始值	推荐

4. 实际例子：计算一周睡眠总时长

原始写法（重复、易出错）

const getActualSleepHours = () => {
  return getSleepHours("Monday") +
         getSleepHours("Tuesday") +
         getSleepHours("Wednesday") +
         getSleepHours("Thursday") +
         getSleepHours("Friday") +
         getSleepHours("Saturday") +
         getSleepHours("Sunday");
};

5. 核心原理一步步拆解

days.reduce((sum, day) => sum + getSleepHours(day), 0)

执行过程：

初始值 sum = 0
第1轮：sum = 0 + 8 → sum = 8
第2轮：sum = 8 + 7.3 → sum = 15.3
...
第7轮结束后返回最终总和 51.8

6. 箭头函数的 `return` 规则

重要：

一行写法（推荐）：
```
(sum, day) => sum + getSleepHours(day)
```
→ => 右侧表达式的结果会自动返回，不需要写 return

多行写法（需要大括号）：

(sum, day) => {
  const hours = getSleepHours(day);
  return sum + hours;        // 必须手动写 return
}

关键点：函数返回的是 => 右侧计算后的值，而不是变量名 sum 或 day。

7. 常见错误示例

// 错误1：忘记写初始值 0
.reduce((sum, day) => sum + getSleepHours(day))   // 可能导致字符串拼接

// 错误2：只返回当前元素
.reduce((sum, day) => day)                        // 结果只剩最后一个元素

// 错误3：不累加
.reduce((sum, day) => sum)                        // 结果永远是初始值

8. 最佳实践总结

永远传入初始值（数字累加时用 0）
使用简洁箭头函数：(acc, cur) => acc + cur
累加器变量名推荐使用 total、sum、acc
需要复杂逻辑时才使用 { } + return

9. 练习题

const numbers = [1, 2, 3, 4, 5];

// 1. 计算总和
// 2. 计算平均值
// 3. 把数组转成对象 {1: true, 2: true, ...}

一句话总结：

reduce() 的本质是：拿着上一次的结果（accumulator），和当前元素做运算，然后把新结果传给下一次。

Js-Reduce

JavaScript reduce() 方法

1. 什么是 reduce()？