JavaScript 数组 reduce 用法太难？这 5 个例子助你轻松掌握！

在 JavaScript 中，数组的 reduce 方法是一个强大但有时令人感到困惑的工具。然而，通过以下 5 个例子，您将能够轻松掌握它的用法。

例子 1：计算数组元素的总和

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

在这个例子中，accumulator 初始值为 0，每次迭代将当前元素 currentValue 累加到 accumulator 上。

例子 2：计算数组元素的乘积

let nums = [2, 3, 4];
let product = nums.reduce((a, b) => a * b, 1);
console.log(product);

这里初始值为 1，通过不断相乘得到最终的乘积。

例子 3：将数组转换为对象

let students = [
  { name: 'Alice', age: 20 },
  { name: 'Bob', age: 21 },
  { name: 'Charlie', age: 19 }
];

let studentObject = students.reduce((obj, student) => {
  obj[student.name] = student.age;
  return obj;
}, {});

console.log(studentObject);

此例将数组中的每个学生对象转换为以学生名字为键、年龄为值的对象。

例子 4：找出数组中的最大值

let values = [5, 8, 2, 10, 3];
let maxValue = values.reduce((max, current) => (current > max? current : max), values[0]);
console.log(maxValue);

通过比较当前值和已有的最大值，不断更新最大值。

例子 5：按条件分组数组元素

let fruits = [
  { name: 'apple', type: 'sweet' },
  { name: 'banana', type:'sweet' },
  { name: 'lemon', type:'sour' },
  { name: 'orange', type:'sweet' }
];

let groupedFruits = fruits.reduce((groups, fruit) => {
  if (!groups[fruit.type]) {
    groups[fruit.type] = [];
  }
  groups[fruit.type].push(fruit);
  return groups;
}, {});

console.log(groupedFruits);

以上 5 个例子涵盖了 reduce 方法的常见用法，希望能帮助您更好地理解和运用这个强大的工具，让您在 JavaScript 编程中更加得心应手。只要多加练习，您会发现 reduce 方法为处理数组数据提供了极大的灵活性和效率。