最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
如何利用 Object.groupBy(ES2026)依据业务字段对数组进行高效分组
时间:2026-07-21 17:23:01 编辑:袖梨 来源:一聚教程网
Object.groupBy() 一行代码实现数组分组,支持按字段或自定义逻辑生成分组键,返回以键为属性名、对应元素数组为值的对象。
直接用 Object.groupBy() 就行,一行代码搞定分组,不用再写冗长的 reduce。
按单个字段快速分组
适合大多数基础场景,比如按状态、角色、类型等字符串字段归类。
- 传入数组和一个返回分组键的回调函数,例如
user => user.role或order => order.status - 返回值是一个普通对象,属性名是分组键(自动转为字符串),属性值是该组的元素数组
- 示例:把用户按角色分组
const grouped = Object.groupBy(users, user => user.role);
// → { admin: [...], user: [...] }
按计算逻辑动态分组
不只是取字段,还能做判断、格式化、组合等处理,让分组更贴合业务需求。
- 回调中可写任意逻辑,比如按分数划等级、按日期截取年月、按金额区间分类
- 注意返回值会被当作对象属性名,所以非字符串类型会自动调用
toString() - 示例:订单按金额区间分组
const byRange = Object.groupBy(orders, o =>
o.amount o.amount );
// → { 小额: [...], 中额: [...], 大额: [...] }
兼容老环境的稳妥做法
如果项目还需支持旧版浏览器或 Node.js 低版本,加个轻量 polyfill 即可无缝使用。
- 检查是否原生支持:
if (!Object.groupBy) - 用
reduce模拟实现,核心逻辑就是acc[key] ??= []再.push(item) - 生产环境建议用
core-js等成熟垫片库,避免自己维护边界情况
什么时候该用 Map.groupBy
当分组键不是字符串,而是对象、函数、Symbol 或 null/undefined 时,Object.groupBy 会失效(因为对象属性名只能是字符串或 Symbol,且 Symbol 不会自动匹配)。
- 此时改用
Map.groupBy(),它支持任意类型的键,并返回Map实例 - 例如:按某个对象引用本身分组,或按
new Date().getFullYear()这类可能为数字的值分组 - 调用方式一致,只是构造结果不同:
Map.groupBy(items, item => item.category)
相关文章
- 崩坏:星穹铁道千冶-刃核心定位 07-31
- 《解压找茬烧脑》跨栏女神助力运动员加速跨栏夺冠通关攻略 07-31
- 解压找茬烧脑:妈妈洗脚给妈妈舒服的洗一次脚通关攻略 07-31
- 异环打卡拍照点介绍 07-31
- 解压找茬烧脑姐妹约会给姐妹穿上合适的衣服去约会通关攻略 07-31
- 蓝色星原:旅谣 奇波属性培养攻略 07-31