首页 游戏 软件 资讯 排行榜 专题
首页
前端开发
如何利用 Object.groupBy(ES2024)根据业务字段对数组进行高效分组

如何利用 Object.groupBy(ES2024)根据业务字段对数组进行高效分组

热心网友
97
转载
2026-04-17

如何利用 Object.groupBy(ES2024)根据业务字段对数组进行高效分组

如何利用 Object.groupBy(ES2024)根据业务字段对数组进行高效分组

免费影视、动漫、音乐、游戏、小说资源长期稳定更新! 👉 点此立即查看 👈

你是否厌倦了为数组分组编写冗长的 reduce 代码?现在,使用 ES2024 的新特性 Object.groupBy(),一行代码即可轻松实现。这个强大的 JavaScript 数组分组方法,让依据字段或自定义逻辑生成分组对象变得前所未有的简洁高效,极大提升了开发效率。

按单个字段快速分组

这是最常见且直观的应用场景。无论是按用户角色、订单状态,还是产品类别进行归类,只要是基于某个字符串字段,Object.groupBy 都能轻松胜任。

其用法非常直观:传入目标数组和一个回调函数,该函数返回每个元素的分组键。例如 user => user.roleorder => order.status。最终,你将获得一个普通对象,其属性名即为分组键(会自动转换为字符串),属性值则是该组所有元素构成的数组。

以下是一个具体示例,演示如何将用户列表按角色进行分组:

const users = [
  { name: '张三', role: 'admin' },
  { name: '李四', role: 'user' },
  { name: '王五', role: 'admin' }
];
const grouped = Object.groupBy(users, user => user.role);
// 结果:{ admin: [{...}, {...}], user: [{...}] }

按计算逻辑动态分组

分组需求当然不仅限于直接读取字段。很多时候,我们需要根据计算或条件判断来动态生成分组键,Object.groupBy 的回调函数为此提供了完美的舞台。

你可以在回调函数中编写任何逻辑:根据分数划定等级、截取日期中的年月部分、或将金额归入不同的区间。需要注意的是:回调函数的返回值将用作对象的属性名,因此非字符串类型(如数字、日期)会自动调用其 toString() 方法进行转换。

例如,将订单按金额区间进行智能归类:

const orders = [
  { id: 1, amount: 980 },
  { id: 2, amount: 5200 },
  { id: 3, amount: 12000 }
];
const byRange = Object.groupBy(orders, o =>
  o.amount < 1000 ? '小额' :
  o.amount < 10000 ? '中额' : '大额'
);
// 结果:{ 小额: [{...}], 中额: [{...}], 大额: [{...}] }

兼容老环境的稳妥做法

新技术虽好,但如果项目仍需支持旧版浏览器或低版本的 Node.js 环境,直接使用可能会遇到兼容性问题。无需担心,已有成熟的解决方案。

首先,可以通过 if (!Object.groupBy) 来检测当前环境是否原生支持该特性。如果不支持,一个轻量级的 polyfill(垫片)即可让它无缝工作。这个 polyfill 的核心逻辑,其实就是我们熟悉的 reduce 方法:初始化一个空对象,为每个元素计算键,如果该键不存在则初始化一个空数组,然后将元素推入。

对于生产环境,更推荐直接引入 core-js 这类成熟的垫片库。它们已经妥善处理了各种边界情况,比自己维护要可靠得多。

什么时候该用 Map.groupBy

那么,Object.groupBy 是万能的吗?并非如此。当你的分组键不是字符串时,就会遇到限制。例如,你想用一个对象引用、一个函数,或者 nullundefined 作为键。因为普通对象的属性名只能是字符串或 Symbol,并且 Symbol 键不会自动匹配。

这时,就该它的兄弟方法 Map.groupBy() 登场了。它支持任意类型的值作为键,并返回一个 Map 实例。调用方式与 Object.groupBy 完全一致,只是结果类型不同。

典型的使用场景包括:按某个对象实例本身进行分组,或者按像 new Date().getFullYear() 这样返回数字的表达式分组。用法示例如下:

const groupedMap = Map.groupBy(items, item => item.category);

简单来说,当需要普通对象时使用 Object.groupBy,当需要更灵活的键类型时则选择 Map.groupBy。两者结合,足以覆盖前端开发中绝大部分的数组分组场景。

来源:https://www.php.cn/faq/2335550.html
免责声明: 游乐网为非赢利性网站,所展示的游戏/软件/文章内容均来自于互联网或第三方用户上传分享,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系youleyoucom@outlook.com。

相关攻略

为什么合约开单瞬间就亏损了?详解滑点、点差对交易的影响
web3.0
为什么合约开单瞬间就亏损了?详解滑点、点差对交易的影响

Binance币安 欧易OKX ️ Huobi火币️ gateio芝麻 很多交易者都遇到过这样的困惑:明明刚按下开仓键,账户却立刻显示浮亏。这并非系统错误,而是滑点与点差在成交瞬间共同作用的结果。简单来说,这两者并非独立事件,而是共同构成了你实际入场成本的核心部分。 一、点差导致开仓即亏损的机制 点

热心网友
04.17
网易花田app如何发起约会
手机教程
网易花田app如何发起约会

在网易花田App上发起约会,其实有章可循 对于寻找伴侣的单身朋友来说,网易花田App提供了一个高效的婚恋交友平台。但线上匹配成功只是第一步,如何从线上聊天自然地过渡到线下约会,往往是许多人关心的问题。今天,我们就来拆解一下,在这个平台上发起一次成功邀约的具体步骤。 第一步:从发现到连接 首先,你需要

热心网友
04.17
消息爆料:iPhone 18 Pro 或推灰银深红三色 红色首登 Pro 机型
科技数码
消息爆料:iPhone 18 Pro 或推灰银深红三色 红色首登 Pro 机型

苹果iPhone 18 Pro新配色曝光:深红色或首次登陆Pro系列 近日,科技圈传来新消息。根据渠道方WHYLAB的爆料,下一代iPhone 18 Pro系列在机身配色上可能会有新动作。除了经典的银色和低调的灰色,一个全新的深红色版本可能首次亮相。与此同时,数码博主fpt基于现有信息制作了一组概念

热心网友
04.17
德国精工,专业排“污”——赫泊水泵深耕中国市场,引领高端污水提升新典范
科技数码
德国精工,专业排“污”——赫泊水泵深耕中国市场,引领高端污水提升新典范

Himpoo赫泊:源自德国的高端家用污水提升专家 在高端家用污水提升领域,有一个名字始终与严苛标准、精密工艺和可靠性能紧密相连,那就是源自德国的Himpoo赫泊。作为一个深耕于此的专业品牌,赫泊将德国工业的严谨精神,倾注于每一款家用污水提升产品的设计与制造之中。正是这种对品质的极致追求,使其不仅赢得

热心网友
04.17
国庆节的简短精美句子
礼仪与书信
国庆节的简短精美句子

国庆节的简短精美句子(1--17条) 1 我们伟大的祖国,山河壮丽,气象恢弘。守护这份来之不易的盛世图景,并为之持续奋斗,是每一位中华儿女的光荣使命。 2 七十余载辉煌历程,举国欢腾共庆华诞。神州大地遍洒欢歌,世界舞台因中国风采而愈加绚烂! 3 一路风雨同行,我们与国家血脉相连,共同成长,彼此

热心网友
04.17

最新APP

宝宝过生日
宝宝过生日
应用辅助 04-07
台球世界
台球世界
体育竞技 04-07
解绳子
解绳子
休闲益智 04-07
骑兵冲突
骑兵冲突
棋牌策略 04-07
三国真龙传
三国真龙传
角色扮演 04-07

热门推荐

小米电视:以创新科技与贴心设计,打造家庭影院新体验的优选之品
科技数码
小米电视:以创新科技与贴心设计,打造家庭影院新体验的优选之品

智能家居赛道激战正酣,小米电视凭何赢得消费者青睐? 如今的智能家居市场,早已是一片红海。各方势力角逐之下,小米电视却悄然跃升为许多家庭选购清单上的重要选项。从沉浸式的家庭影院到酣畅淋漓的游戏娱乐,它凭借一套覆盖多元场景的产品组合,其市场表现值得深入一探。 核心优势:一张覆盖全场景的产品网 说起小米电

热心网友
04.17
王者万象棋女娲出装攻略
游戏攻略
王者万象棋女娲出装攻略

王者万象棋女娲最强出装与实战手法全攻略 在《王者万象棋》的激烈对抗中,决定一位英雄上限的往往不只是其技能机制,更在于能否通过精准的装备搭配,将她的核心能力彻底解放。女娲正是如此,一套契合版本的出装方案,是她掌控全场节奏、奠定胜局的核心保障。 王者万象棋女娲怎么出装 要让女娲的远程消耗与爆发控制能力全

热心网友
04.17
c语言函数递归 实操经验总结:这些技巧很实用
编程语言
c语言函数递归 实操经验总结:这些技巧很实用

深入理解C语言递归的核心原理与工作机制在C语言编程中,递归是一种强大的编程范式,指函数直接或间接调用自身来解决问题。掌握递归的关键在于领悟其核心思想:将复杂的原始问题,逐步分解为结构相似但规模更小的子问题,直至子问题简化到能够直接求解的基线条件。这一过程主要包含两个不可或缺的组成部分:递归基(出口)

热心网友
04.17
xbox one 游戏 实际使用记录与经验整理
游戏资讯
xbox one 游戏 实际使用记录与经验整理

Xbox One的硬件体验与日常维护作为一款已进入生命成熟期的游戏主机,Xbox One在长期使用中展现出了其设计的稳定性。其机身设计相对宽大,这为内部散热提供了一定空间,但也意味着在电视柜中需要占据不小的位置。在长时间游戏后,机身会排出温热空气,这属于正常现象,保持良好的通风环境至关重要,避免将主

热心网友
04.17
如何在合约交易中利用“一目均衡表(IKH)”判断长线趋势?
web3.0
如何在合约交易中利用“一目均衡表(IKH)”判断长线趋势?

如何在合约交易中利用“一目均衡表(IKH)”判断长线趋势? 判断长线趋势,从来不是单凭一两个信号就能拍板的。它更像是一个系统工程,需要多个维度的证据相互印证。说到这,就不得不提一目均衡表(IKH)这套经典工具。它之所以在趋势交易者中备受推崇,正是因为它提供了一套环环相扣的验证逻辑。 一目均衡表长线趋

热心网友
04.17