当前位置: 首页 > news >正文

lodash 的 _.groupBy 函数是怎么实现的?

说在前面

🎈lodash的_.groupBy函数可以将一个数组按照给定的函数分组,返回一个新对象。该函数接收两个参数:第一个参数是要进行分组的数组,第二个参数是用于分组的函数。该函数会对数组中的每个元素进行处理,返回一个值作为分组依据。最终返回的对象中,每个键代表一组,对应的值则是符合该组的元素组成的数组。

.groupBy函数的主要作用是方便对数组中的元素进行分类或分组,并且在分组后可以方便地对每个组内的元素进行处理,比如统计数量、求平均值等。同时,由于lodash库已经封装了大量的常用函数,使用.groupBy函数也能够减少我们自己编写代码的工作量,提高开发效率。

目标

编写一段可应用于所有数组的代码,使任何数组调用 array. groupBy(fn) 方法时,它返回对该数组 分组后 的结果。

数组 分组 是一个对象,其中的每个键都是 fn(arr[i]) 的输出的一个数组,该数组中含有原数组中具有该键的所有项。

提供的回调函数 fn 将接受数组中的项并返回一个字符串类型的键。

每个值列表的顺序应该与元素在数组中出现的顺序相同。任何顺序的键都是可以接受的。

示例 1:

输入:
array = [{"id":"1"},{"id":"1"},{"id":"2"}
], 
fn = function (item) { return item.id; 
}
输出:
{ "1": [{"id": "1"}, {"id": "1"}],   "2": [{"id": "2"}] 
}
解释:
输出来自函数 array.groupBy(fn)。
分组选择方法是从数组中的每个项中获取 "id" 。
有两个 "id" 为 1 的对象。所以将这两个对象都放在第一个数组中。
有一个 "id" 为 2 的对象。所以该对象被放到第二个数组中。

示例 2:

输入:
array = [[1, 2, 3],[1, 3, 5],[1, 5, 9]
]
fn = function (list) { return String(list[0]); 
}
输出:
{ "1": [[1, 2, 3], [1, 3, 5], [1, 5, 9]] 
}
解释:
数组可以是任何类型的。在本例中,分组选择方法是将键定义为数组中的第一个元素。
所有数组的第一个元素都是1,所以它们被组合在一起。
{"1": [[1, 2, 3], [1, 3, 5], [1, 5, 9]]
}

示例 3:

输出:
array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
fn = function (n) { return String(n > 5);
}
输入:
{"true": [6, 7, 8, 9, 10],"false": [1, 2, 3, 4, 5]
}
解释:
分组选择方法是根据每个数字是否大于 5 来分割数组。

提示:

  • 0 <= array.length <= 105
  • fn 返回一个字符串

思路分析

定义一个名为groupBy的方法,通过扩展Array原型来实现。该方法接受一个函数fn作为参数,并返回一个对象。该对象的键是将数组中的元素通过fn函数处理后得到的结果,值是符合该键的元素组成的数组。

具体地说,代码首先创建一个空对象map。然后使用forEach方法遍历调用groupBy方法的数组,对于每个元素,通过fn函数获取一个键key。然后从map对象中取出键为key的值,如果不存在则初始化为空数组。将当前元素添加到该数组中,然后再将更新后的数组赋值给map对象的键key。

最后,返回map对象,该对象包含了按照fn函数分组后的结果。

完整代码

/*** @param {Function} fn* @return {Object}*/
Array.prototype.groupBy = function(fn) {// 检查参数类型if (typeof fn !== 'function') {throw new TypeError('The parameter must be a function.');}const map = {};this.forEach(item => {const key = fn(item);const val = map[key] || [];val.push(item);map[key] = val;});return map;};/*** [1,2,3].groupBy(String) // {"1":[1],"2":[2],"3":[3]}*/

公众号

关注公众号『前端也能这么有趣』,获取更多有趣内容。

说在后面

🎉 这里是 JYeontu,现在是一名前端工程师,有空会刷刷算法题,平时喜欢打羽毛球 🏸 ,平时也喜欢写些东西,既为自己记录 📋,也希望可以对大家有那么一丢丢的帮助,写的不好望多多谅解 🙇,写错的地方望指出,定会认真改进 😊,偶尔也会在自己的公众号『前端也能这么有趣』发一些比较有趣的文章,有兴趣的也可以关注下。在此谢谢大家的支持,我们下文再见 🙌。

http://www.lryc.cn/news/283752.html

相关文章:

  • (2024,ViM,双向 SSM 骨干,序列建模)利用双向状态空间模型进行高效视觉表示学习
  • docker容器和常用命令
  • 【征服redis9】快速征服lua脚本
  • vue3.2二次封装antd vue 中的Table组件,原有参数属性不变
  • GBASE南大通用分享,如何修改可信上下文
  • 冻结Prompt微调LM: T5 PET (a)
  • 119 BFS和DFS解二叉树的所有路径
  • SpringBoot缓存相关注解的使用
  • SpiderFlow爬虫平台漏洞利用分析(CVE-2024-0195)
  • 计算机网络-甘晴void学习笔记
  • vue中使用echarts实现省市地图绘制,根据数据在地图上显示柱状图信息,增加涟漪特效动画效果
  • Android aar包集成与报错
  • CentOS 7.9 安装图解
  • Gitea Webhook报错 webhook.ALLOWED_HOST_LIST setting
  • SQL 最大连续合格次数 最大连胜记录次数 最大连败记录次数
  • 着色器语言GLSL学习
  • C#: form 窗体的各种操作
  • “尔滨”宠粉再升级!百亿像素VR冰雪盛宴
  • redis原理(四)redis命令
  • FairGuard游戏安全2023年度报告
  • 进阶Docker4:网桥模式、主机模式与自定义网络
  • Qt 状态机框架:The State Machine Framework (二)
  • 【Redis】更改redis中的value值
  • 数据结构Java版(2)——栈Stack
  • tcpdump 用法
  • JavaScript SEO:如何为搜索引擎优化 JS
  • 深入探讨生产环境中秒杀接口并发量剧增、负载过高的情况该如何应对?
  • C语言再学习 -- C语言搭建TCP服务器/客户端
  • 企业远程控制如何保障安全?向日葵“全流程安全远控闭环”解析
  • 为什么需要放行回源IP