#LearnedToday：ObjectgroupBy()

?终于出来了！不再需要编写丑陋的代码来按字段的特定值对对象数组进行分组！

自 2023 年底以来，对象有一个名为 groupby() 的官方静态方法，可以为我们做到这一点！
它接受一个 iterable（例如数组）和一个函数，该函数针对每个元素执行，并且必须返回该特定元素的“类别”。
该方法返回一个新对象，其中每个键都是一个不同的类别，其中包含属于该特定类别的对象数组。

注意：返回的对象和原始可迭代对象中的元素是相同的（不是深拷贝！）。更改元素的内部结构将反映在原始可迭代对象和返回的对象中。

例子

让我们举一个实际的例子来看看按年龄对所有忍者神龟角色进行分组是多么容易。

初始数组

const ninjaturtlescharacters = [
  { age: 16, name: 'michelangelo' },
  { age: 16, name: 'raffaello' },
  { age: 16, name: 'donatello' },
  { age: 16, name: 'leonardo' },
  { age: 91, name: 'splinter' },
  { age: 25, name: 'casey jones' },
  { age: 25, name: 'april o\'neil' }
];

好的老方法（使用reduce）

const ninjaturtlescharactersbyage = ninjaturtlescharacters.reduce(
  (groupedpeople, item) => ({
    ...groupedpeople,
    [item.age]: groupedpeople[item.age]
      ? [...groupedpeople[item.age], item]
      : [item],
  }),
  {}
);

现代方式

const ninjaturtlescharactersbyagenew = object.groupby(
  ninjaturtlescharacters,
  ({ age }) => age
);

提示：如果您想返回 map 而不是 object，请使用 map.groupby()

结果

{
  "16": [
    { age: 16, name: 'Michelangelo' },
    { age: 16, name: 'Raffaello' },
    { age: 16, name: 'Donatello' },
    { age: 16, name: 'Leonardo' }
  ],
  "25": [
    { age: 25, name: 'Casey Jones' },
    { age: 25, name: 'April O\'Neil' }
  ],
  "91": [
    { age: 91, name: 'Splinter' }
  ]
}

演示

??‍? 像往常一样，我创建了一个简单的 stackblitz 项目来使用代码。

ONLYOFFICE

用ONLYOFFICE管理你的网络私人办公室

下载

? 文档：https://developer.mozilla.org/en-us/docs/web/javascript/reference/global_objects/object/groupby

ℹ 浏览器支持：https://caniuse.com/mdn-javascript_builtins_object_groupby