面试官：说说 reduce 的6种巧妙用法

面试中。。。

我们都知道 Array.prototype.reduce 是 JavaScript 中的 API 方法，它可以用来处理数组中的元素，并将它们归约成一个单一的值。

尽管它最常用于累加数组中的数值，但 reduce 还有许多其他巧妙的应用场景。我们来看看 reduce 有哪些的有趣用法，能帮助我们更好地面试效果。

1. 数组去重

有时候，我们需要从一个数组中去除重复的元素。reduce 可以很方便地实现这一功能：

const uniqueArray = (arr) => arr.reduce((acc, item) => {
  if (!acc.includes(item)) {
    acc.push(item);
  }
  return acc;
}, []);

const arr = [1, 2, 2, 3, 4, 4, 5];
console.log(uniqueArray(arr)); // [1, 2, 3, 4, 5]

是不是在你面试，进行笔试时给面试官眼前一亮！！

2. 数组分组

你可以使用 reduce 将数组中的元素根据某些属性分组：

const groupBy = (arr, key) => arr.reduce((result, item) => {
  (result[item[key]] = result[item[key]] || []).push(item);
  return result;
}, {});

const data = [
  { category: 'Fruit', name: 'Apple' },
  { category: 'Fruit', name: 'Banana' },
  { category: 'Vegetable', name: 'Carrot' }
];
console.log(groupBy(data, 'category'));
// {
//   Fruit: [{ category: 'Fruit', name: 'Apple' }, { category: 'Fruit', name: 'Banana' }],
//   Vegetable: [{ category: 'Vegetable', name: 'Carrot' }]
// }

3. 计算数组中的最大/最小值

reduce 也可以用来找出数组中的最大或最小值：

const max = (arr) => arr.reduce((max, curr) => (curr > max ? curr : max), arr[0]);
const min = (arr) => arr.reduce((min, curr) => (curr < min ? curr : min), arr[0]);

const numbers = [10, 5, 100, 50];
console.log(max(numbers)); // 100
console.log(min(numbers)); // 5

4. 计算对象属性总和

如果数组中的每个元素都是一个对象，reduce 可以用来计算某个属性的总和：

const sumProperty = (arr, prop) => arr.reduce((sum, obj) => sum + obj[prop], 0);

const items = [
  { price: 10 },
  { price: 20 },
  { price: 30 }
];
console.log(sumProperty(items, 'price')); // 60

5. 计算嵌套对象的总和

对于嵌套的对象结构，reduce 也能有效地汇总数据：

const data = [
  { category: 'A', values: [1, 2] },
  { category: 'B', values: [3, 4] }
];

const totalValues = data.reduce((sum, item) => sum + item.values.reduce((a, b) => a + b, 0), 0);
console.log(totalValues); // 10

6. 计算每个字符的出现次数

reduce 也可以用于统计字符串中每个字符的出现次数：

const countChars = (str) => str.split('').reduce((acc, char) => {
  acc[char] = (acc[char] || 0) + 1;
  return acc;
}, {});

const str = 'hello world';
console.log(countChars(str));
// { h: 1, e: 1, l: 3, o: 2, ' ': 1, w: 1, r: 1, d: 1 }

总结

不得不说 reduce 是一个极其强大的 JavaScript API，它不仅可以用于累加，还能处理许多复杂的数据变换。大家怎么认为呢？