news 2026/6/23 23:13:46

高阶函数之-数据分组的思考

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
高阶函数之-数据分组的思考

看一个例子,刚开始,你可能会这样写

constpeople=[{name:'ALice',age:30,sex:'female'},{name:'BOb',age:25,sex:'male'},{name:'Chartlie',age:30,sex:'male'},{name:'Diana',age:25,sex:'female'},{name:'Eva',age:25,sex:'female'},{name:'Frank',age:25,sex:'male'},{name:'Grace',age:20,sex:'female'},];// 按年龄分组constresult={};for(constitemofpeople){constkey=item.age;if(!result[key]){result[key]=[];}result[key].push(item);}

但有一天可能按照性别分组,你不得不重新写一下代码,改成下面这样

constpeople=[{name:'ALice',age:30,sex:'female'},{name:'BOb',age:25,sex:'male'},{name:'Chartlie',age:30,sex:'male'},{name:'Diana',age:25,sex:'female'},{name:'Eva',age:25,sex:'female'},{name:'Frank',age:25,sex:'male'},{name:'Grace',age:20,sex:'female'},];// 按年龄分组// const result = {};// for(const item of people){// const key = item.age;// if(!result[key]){// result[key]=[];// }// result[key].push(item);// }// 按性别分组constresult={};for(constitemofpeople){constkey=item.sex;if(!result[key]){result[key]=[];}result[key].push(item);}

此时,我们应该想到应该写一个通用的分组函数来完成分组操作

//分组函数functiongroupBy(arr,propName){constresult={};for(constitemofarr){constkey=item[propName];if(!result[key]){result[key]=[];}result[key].push(item);}returnresult}constresult1=groupBy(people,'age')constresult2=groupBy(people,'sex')

此时到这还没结束,可能有一天我们那个数组的某个元素又是一个对象的话,比如address:{province:"河南’,city:‘开封’},我们可能想按照省份分组又该怎么做呢,再比如如果是按照年龄加上性别来分组,还有可能按照分组的数据是一个数字,让他按照奇偶数来分组又应该如何做呢,这个函数又用不了了,那么如何能让该函数更加的通用适应所有的分组操作呢,其实关键就在于那个键值key,他不应该仅仅是一个字符串,他的获取应该是一个过程,获取属性名来得到键只是这种过程中的一种,那么考虑到这一点,我们发现,他应该是一个函数才对,

//分组函数functiongroupBy(arr,generateKey){constresult={};for(constitemofarr){constkey=generateKey(item);if(!result[key]){result[key]=[];}result[key].push(item);}returnresult}// 按年龄constresult1=groupBy(people,(item)=>item.age)// 按性别constresult2=groupBy(people,(item)=>item.sex)// 按年龄-性别constresult3=groupBy(people,(item)=>`${item.age}-${item.sex}`)// 如果数组是存数字constarr=[34,6,321,3,5,7];constresult4=groupBy(arr,(item)=>item%2===0?'偶':'奇')

那么这个函数在功能上是没有什么问题了,但是在使用上还不那么舒服,我们希望他支持两种方式来传递,第一种按照属性名来分组,第二种按照函数来,那么这个参数就出现了两种情况,那么就需要用到参数归一化了

//分组函数functiongroupBy(arr,generateKey){if(typeofgenerateKey==='string'){constpropName=generateKey;generateKey=(item)=>item[propName]}constresult={};for(constitemofarr){constkey=generateKey(item);if(!result[key]){result[key]=[];}result[key].push(item);}returnresult}// 按年龄constresult1=groupBy(people,'age')// 按性别constresult2=groupBy(people,'sex')// 按年龄-性别constresult3=groupBy(people,(item)=>`${item.age}-${item.sex}`)// 如果数组是存数字constarr=[34,6,321,3,5,7];constresult4=groupBy(arr,(item)=>item%2===0?'偶':'奇')

非原创,来自渡一袁老师,简单记录,每日分享

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/20 19:15:25

Wan2.2-T2V-5B能否理解‘慢动作’‘快进’等时间修饰词?

Wan2.2-T2V-5B能否理解“慢动作”“快进”等时间修饰词? 在短视频工厂每天要产出上千条内容的今天,AI生成视频早已不是“能不能做”的问题,而是“能不能秒出、批量跑、成本低”的现实拷问。🔥 于是,像 Wan2.2-T2V-5B …

作者头像 李华
网站建设 2026/6/23 13:24:52

终极CotEditor开源贡献完整指南:从入门到精通

终极CotEditor开源贡献完整指南:从入门到精通 【免费下载链接】CotEditor Lightweight Plain-Text Editor for macOS 项目地址: https://gitcode.com/gh_mirrors/co/CotEditor CotEditor作为macOS平台上一款轻量级纯文本编辑器,凭借其原生用户体验…

作者头像 李华
网站建设 2026/6/23 22:59:30

千万别信!留学生求职辅导真的管用吗?

千万别信!留学生求职辅导真的管用吗?洞悉价值与陷阱,做出明智选择“求职辅导不是保险箱,但没有地图的航海,注定会触礁。”近期,随着秋招临近,围绕“留学生回国求职”的话题再次升温。一个普遍的…

作者头像 李华
网站建设 2026/6/23 5:54:08

ESD保护器件基础选型指南:从参数到实战

在电子产品的设计与生产中,静电放电(ESD)防护是确保系统可靠性的第一道防线。一颗不起眼的ESD保护二极管(常称为ESD管、TVS管)选型不当,可能导致产品在测试、生产甚至用户手中频繁失效。本文将系统梳理ESD保…

作者头像 李华
网站建设 2026/6/22 16:01:04

系统级ESD防护设计:超越单一器件的思考

为关键接口选配一颗高性能的ESD保护器件,只是防护设计的第一步。真正的稳健性来自于系统级的防护架构思考。本文将探讨如何将ESD保护器件融入整个PCB及系统设计,构建多层次、高可靠的静电防护体系。 防护等级与器件的匹配:并非越高越好 许…

作者头像 李华
网站建设 2026/6/23 22:26:15

PHP实现电商GraphQL API的8个避坑指南(资深架构师亲授)

第一章:PHP实现电商GraphQL API的核心挑战在构建现代电商平台时,采用GraphQL作为API层已成为提升前后端协作效率的重要手段。然而,使用PHP实现一个高性能、可维护的GraphQL接口仍面临诸多技术挑战,尤其是在处理复杂查询、数据加载…

作者头像 李华