reduce 方法概述
- reduce 方法是 JavaScript 数组的一个高阶函数，用于将数组元素通过一个累加器组合成单个值
array.reduce(callback(accumulator, currentValue, index, array), initialValue)
| 参数 |
说明 |
是否可选 |
| callback |
执行数组中每个元素的函数 |
必需 |
| initialValue |
作为第一次调用 callback 时的第一个参数的值 |
可选 |
| 参数 |
说明 |
是否可选 |
| accumulator |
累加器，累计回调的返回值 |
必需 |
| currentValue |
数组中正在处理的元素 |
必需 |
| index |
数组中正在处理的元素的索引 |
可选 |
| array |
调用 reduce 方法的数组 |
可选 |
reduce 方法基本用法
- 数组求和
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum);
# 输出结果
10
- 数组求积
const numbers = [1, 2, 3, 4];
const product = numbers.reduce((acc, curr) => acc * curr, 1);
console.log(product);
# 输出结果
24
- 查找最大值
const numbers = [1, 2, 3, 4];
const max = numbers.reduce((acc, curr) => Math.max(acc, curr), -Infinity);
console.log(max);
# 输出结果
4
- 对象数组属性求和
const orders = [
{ id: 1, amount: 100 },
{ id: 2, amount: 200 },
{ id: 3, amount: 300 },
];
const totalAmount = orders.reduce((sum, order) => sum + order.amount, 0);
console.log(totalAmount);
# 输出结果
600
reduce 方法高级用法
- 数组扁平化
const nested = [
[1, 2],
[3, 4],
[5, 6],
];
const flat = nested.reduce((acc, curr) => acc.concat(curr), []);
console.log(flat);
# 输出结果
(6) [1, 2, 3, 4, 5, 6]
- 统计字符出现次数
const letters = "hello world".split("");
const count = letters.reduce((acc, curr) => {
if (acc[curr]) {
acc[curr]++;
} else {
acc[curr] = 1;
}
return acc;
}, {});
console.log(count);
# 输出结果
{
h: 1,
e: 1,
l: 3,
o: 2,
" ": 1,
w: 1,
r: 1,
d: 1
}
- 按属性分组对象
const people = [
{ name: "Alice", age: 21 },
{ name: "Bob", age: 21 },
{ name: "Charlie", age: 20 },
];
const grouped = people.reduce((acc, person) => {
const age = person.age;
if (!acc[age]) acc[age] = [];
acc[age].push(person);
return acc;
}, {});
console.log(grouped);
# 输出结果
{
21: [
{ name: "Alice", age: 21 },
{ name: "Bob", age: 21 }
],
20: [
{ name: "Charlie", age: 20 }
]
}
- 数组去重
const people = [
{ name: "Alice", age: 21 },
{ name: "Bob", age: 21 },
{ name: "Charlie", age: 20 },
];
const grouped = people.reduce((acc, person) => {
const age = person.age;
if (!acc[age]) acc[age] = [];
acc[age].push(person);
return acc;
}, {});
console.log(grouped);
# 输出结果
(5) [1, 2, 3, 4, 5]
reduce 方法注意事项
- 当对空数组调用 reduce 方法，且没有提供初始值时，会抛出异常
const numbers = [];
const max = numbers.reduce((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
});
console.log(max);
# 输出结果
Uncaught TypeError: Reduce of empty array with no initial value
- 当对空数组调用 reduce 方法，有提供初始值时，会返回初始值
const numbers = [];
const max = numbers.reduce((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
}, 0);
console.log(max);
# 输出结果
0
- 当对非空数组调用 reduce 方法，没有提供初始值时，会将数组的第一个元素作为初始值，从第二个元素开始处理
const numbers = [1, 2, 3, 4];
const max = numbers.reduce((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
});
console.log("max: " + max);
# 输出结果
acc: 1 curr: 2 index: 1
acc: 2 curr: 3 index: 2
acc: 3 curr: 4 index: 3
max: 4
- 当对非空数组调用 reduce 方法，有提供初始值时，会将初始值作为累加器，从数组的第一个元素开始处理
const numbers = [1, 2, 3, 4];
const max = numbers.reduce((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
}, 0);
console.log("max: " + max);
# 输出结果
acc: 0 curr: 1 index: 0
acc: 1 curr: 2 index: 1
acc: 2 curr: 3 index: 2
acc: 3 curr: 4 index: 3
max: 4
- 当对只有 1 个元素的数组调用 reduce 方法，没有提供初始值时，会将数组的第一个元素直接返回
const numbers = [1];
const max = numbers.reduce((acc, curr) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
});
console.log("max: " + max);
# 输出结果
1
- 当对只有 1 个元素的数组调用 reduce 方法，有提供初始值时，会将初始值作为累加器，从数组的第一个元素开始处理
const numbers = [1];
const max = numbers.reduce((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return Math.max(acc, curr);
}, 0);
console.log("max: " + max);
# 输出结果
acc: 0 curr: 1 index: 0
max: 1
reduceRight 方法概述
- reduceRight 方法与 reduce 方法相反，reduce 方法是从左侧开始处理数组，reduceRight 方法是从右侧开始处理数组
reduceRight 方法基本用法
const numbers = [1, 2, 3, 4];
const sum = numbers.reduceRight((acc, curr, index) => {
console.log("acc: " + acc, "curr: " + curr, "index: " + index);
return acc+ curr;
}, 0);
console.log("sum: " + sum);
# 输出结果
acc: 0 curr: 4 index: 3
acc: 4 curr: 3 index: 2
acc: 7 curr: 2 index: 1
acc: 9 curr: 1 index: 0
sum: 10
