Array.prototype.groupBy 数据分组

随着 ECMAScript 标准的持续演进，ES16（ECMAScript 2025）将为我们带来一个实用的新数组方法：Array.prototype.groupBy。这个方法旨在简化常见的数据分组操作，让开发者能够更直观地对数组元素进行分类。

什么是 Array.prototype.groupBy？

groupBy 是即将加入 JavaScript 数组原型的新方法，它允许开发者根据指定的条件将数组元素分组到一个对象中。每个分组的键是分组条件的计算结果，对应的值则是属于该组的元素数组。

基本用法

javascript 复制代码

const inventory = [
  { name: 'apples', type: 'fruit' },
  { name: 'bananas', type: 'fruit' },
  { name: 'carrots', type: 'vegetable' },
  { name: 'beef', type: 'meat' }
];

const grouped = inventory.groupBy(item => item.type);

console.log(grouped);
/*
{
  fruit: [
    { name: 'apples', type: 'fruit' },
    { name: 'bananas', type: 'fruit' }
  ],
  vegetable: [
    { name: 'carrots', type: 'vegetable' }
  ],
  meat: [
    { name: 'beef', type: 'meat' }
  ]
}
*/

高级用法

groupBy 方法还支持更复杂的分组逻辑：

javascript 复制代码

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// 按奇偶分组
const parityGroups = numbers.groupBy(n => n % 2 === 0 ? 'even' : 'odd');

// 按数值范围分组
const rangeGroups = numbers.groupBy(n => {
  if (n < 5) return '0-4';
  if (n < 8) return '5-7';
  return '8-10';
});

与现有解决方案的比较

在 groupBy 方法出现之前，开发者通常需要使用 reduce 来实现类似功能：

javascript 复制代码

// 旧的实现方式
const grouped = inventory.reduce((acc, item) => {
  const key = item.type;
  if (!acc[key]) {
    acc[key] = [];
  }
  acc[key].push(item);
  return acc;
}, {});

相比之下，groupBy 方法提供了更简洁、更易读的语法，同时保持了良好的性能。

浏览器兼容性与替代方案

由于 ES16 尚未被所有浏览器完全支持，在生产环境中使用时可能需要考虑 polyfill 或转译方案。一个简单的 polyfill 实现可能如下：

javascript 复制代码

if (!Array.prototype.groupBy) {
  Array.prototype.groupBy = function(callback) {
    return this.reduce((acc, item, index, array) => {
      const key = callback(item, index, array);
      if (!acc[key]) {
        acc[key] = [];
      }
      acc[key].push(item);
      return acc;
    }, {});
  };
}

性能考虑

对于大型数组，groupBy 的性能与手动实现的 reduce 方案相当，都是 O(n) 时间复杂度。然而，原生实现通常比 JavaScript 实现的 polyfill 有更好的性能表现。

实际应用场景

groupBy 在多种场景下都非常有用：

数据分析和报表生成
前端展示分组列表
数据预处理和转换
统计和聚合操作

总结

Array.prototype.groupBy 是 ECMAScript 2025 中一个值得期待的新特性，它将大大简化日常开发中的数据分组操作。通过提供更直观的语法，它使代码更易读、更易维护。随着 JavaScript 生态系统的不断发展，这类实用的数组方法将继续提升开发者的生产力。

尽管目前浏览器支持可能还不完善，但了解这一新特性有助于我们在它广泛可用时快速采用，或者现在就可以通过 polyfill 提前享受它的便利。