一、介绍reduce方法
reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。
二、reduce方法的语法
duce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
参数
callback
执行数组中每个值的函数,包含四个参数:
accumulator
累计器累计回调返回的结果。它是上一次调用回调时返回的累积值,或者是initialValue。
currentValue
数组中正在处理的元素。
index 可选
数组中正在处理的当前元素的索引。如果提供了initialValue,则起始索引为0,否则为1。
array 可选
调用reduce的数组。
initialValue 可选
作为第一次调用callback函数的第一个参数的值。如果没有提供初始值,则将使用数组中的第一个元素。空数组时如果没有提供initialValue,将会抛出TypeError 。
返回值
函数累积处理后的结果。
三、使用reduce方法的示例
1. 求数组元素的总和
const arr = [1, 2, 3, 4];
const total = duce((acc, cur) => acc + cur, 0);
// total 等于 10
2.将二维数组转为一维
const arr = [[1, 2], [3, 4], [5, 6]];
const flatArr = duce((acc, cur) => at(cur), []);
// flatArr 等于 [1, 2, 3, 4, 5, 6]
3.计算数组中每个元素出现的次数
const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'apple'];
const count = duce((acc, cur) => {
  if (cur in acc) {
    acc[cur]++;
  } else {
    acc[cur] = 1;
  }
  return acc;
}, {});
// count 等于 { apple: 3, banana: 2, orange: 1 }
四、reduce方法的使用注意事项
1. 初始值
在使用reduce时,可以传入一个初始值作为计算的起点。如果不传入初始值,则将使用数组中的第一个元素作为累计器的初始值。
2. 回调函数
回调函数接受四个参数:累加器(acc)、当前值(cur)、当前索引(idx)、原数组(src)。其中,acc 初始值为 initialValue 或者上一次回调的返回值。
jsarray删除元素3. 初始索引
如果提供了初始值(initialValue),那么索引idx从0开始,否则从1开始。
4. 空数组情况
如果数组为空且没有提供初始值,会抛出TypeError。
5. 不改变原数组
reduce方法不改变原数组。
六、总结
reduce() 方法为数组中的每个元素依次执行回调函数(不包括数组中被删除或从未被赋值的元素),如果没有提供 initialValue,则accumulator取数组中的第一个值,之后继续传入数组中的下一个值。如果提供了initialValue,accumulator则为initialValue,之后依次传入数组中的每一个值。最终返回的是计算结果。
在实际应用中,reduce方法能够方便地对数组进行各种计算或转换,帮助我们简化代码,提高编程效率。熟练掌握reduce方法的使用,对于编写高效、简洁的JavaScript代码非常重要。