JavaScript 中 reduce() 的 5 个应用实例

在 JavaScript 中，reduce() 方法是一个强大的数组操作方法，它可以对数组中的元素进行累积计算，并返回一个最终的结果。下面我们将通过 5 个具体的应用实例来深入了解 reduce() 方法的强大功能。

实例一：计算数组元素之和

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

在这个例子中，accumulator 初始值为 0，然后依次加上数组中的每个元素，最终得到数组元素的总和。

实例二：计算数组元素的乘积

const numbers = [2, 3, 4];
const product = numbers.reduce((accumulator, currentValue) => accumulator * currentValue, 1);
console.log(product); 

初始值为 1，通过累积乘法运算得到数组元素的乘积。

实例三：将数组转换为对象

const people = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 35 }
];

const peopleObject = people.reduce((accumulator, currentValue) => {
  accumulator[currentValue.name] = currentValue.age;
  return accumulator;
}, {});

console.log(peopleObject);

这里将数组中的每个元素的 name 作为键，age 作为值，构建了一个对象。

实例四：找出数组中的最大值

const numbers = [5, 10, 15, 20, 25];
const max = numbers.reduce((accumulator, currentValue) => (currentValue > accumulator)? currentValue : accumulator);
console.log(max);

通过比较每个元素和累积值，找到最大值。

实例五：按条件分组

const people = [
  { name: 'Alice', gender: 'female' },
  { name: 'Bob', gender:'male' },
  { name: 'Charlie', gender:'male' },
  { name: 'Diana', gender: 'female' }
];

const groupedPeople = people.reduce((accumulator, currentValue) => {
  if (currentValue.gender in accumulator) {
    accumulator[currentValue.gender].push(currentValue);
  } else {
    accumulator[currentValue.gender] = [currentValue];
  }
  return accumulator;
}, {});

console.log(groupedPeople);

按照 gender 属性对数组进行分组。

通过以上 5 个应用实例，我们可以看到 reduce() 方法在处理数组数据时的灵活性和强大功能。它为我们在 JavaScript 中进行复杂的数据处理提供了便利和高效的方式。