JavaScript reduce() 方法详解-JavaScript中文网-JavaScript教程资源分享门户

在 JavaScript 中，reduce() 是一种非常有用的方法，它可以帮助我们对数组进行迭代和归约操作。使用 reduce() 可以将一个数组转换为单个值，并且能够更加灵活地处理数据。

reduce() 方法的基本语法

array.reduce(callback[, initialValue])

array：要进行迭代的数组。
callback：回调函数，接受 4 个参数：accumulator、currentValue、currentIndex 和 array。
initialValue（可选）：作为第一次调用 callback 函数时的第一个参数的初始值。如果没有提供初始值，则使用数组中的第一个元素。

reduce() 方法的工作原理

reduce() 方法遍历数组中的每一个元素，并执行回调函数来计算结果。回调函数的参数包括：

accumulator：累加器，它是上一次调用回调函数时的返回值或者是 initialValue 的值。
currentValue：当前元素的值。
currentIndex：当前元素在数组中的位置。
array：被 reduce() 遍历的数组。

回调函数返回的值会成为下一次调用该函数的 accumulator 值，最后 reduce() 方法返回 accumulator 的最终值。

下面是一个简单的示例，展示如何使用 reduce() 方法计算数组中所有元素的总和：

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue);
console.log(sum); // 15

在这个示例中，我们首先定义了一个 numbers 数组，然后使用 reduce() 方法计算数组元素的总和。reduce() 方法接受一个回调函数，该函数将累加器和当前元素相加，并返回结果。最后，reduce() 方法返回所有元素的总和。

更多高级用法

使用初始值

如果要指定初始值，可以将初始值作为 reduce() 方法的第二个参数传递。在下面的示例中，我们指定初始值为 10：

const numbers = [1, 2, 3, 4, 5];
const initialValue = 10;
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, initialValue);
console.log(sum); // 25

对象属性求和

除了计算数组中所有元素的总和之外，reduce() 还可以用于对对象属性进行归约操作。假设我们有一个对象数组，每个对象都包含一个 number 属性。我们可以使用 reduce() 方法来计算所有对象的 number 属性的和：

const items = [
  { name: 'item 1', number: 10 },
  { name: 'item 2', number: 20 },
  { name: 'item 3', number: 30 }
];
const total = items.reduce((accumulator, currentValue) => accumulator + currentValue.number, 0);
console.log(total); // 60

在这个示例中，我们定义一个 items 数组，该数组包含三个对象，每个对象都有一个 number 属性。然后我们使用 reduce() 方法来计算所有对象的 number 属性的总和。

数组去重

reduce() 方法还可以用于数组去重。下面是一个示例，展示如何使用 reduce() 方法从数组中删除重复的元素：

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = numbers.reduce((accumulator, currentValue) => {
  if (!accumulator.includes(currentValue)) {
    accumulator.push(currentValue);
  }
  return accumulator;
}, []);
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]

在这个示例中，我们定义一个 numbers 数组，该数组包含一些重复的元素。然后我们使用 reduce() 方法并结合 includes() 方法来删除重复元素。reduce() 方法的初始值是一个空数组，如果当前值不在累加器

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/11618