#LearnedToday:ObjectgroupBy()

#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 项目来使用代码。

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

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

以上就是#LearnedToday:ObjectgroupBy()的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1490898.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月19日 13:32:04
下一篇 2025年12月19日 13:32:21

相关推荐

发表回复

登录后才能评论
关注微信