【JavaScript、TypeScript 实现通过某个属性值对「对象数组」进行】背景
Antd 表格批量处理获取数据相关逻辑
在实际项目业务逻辑开发中 , 前端调用接口请求数据,后台返回的列表数据格式一般是没按某一控制条件进行分组,这时候为了实现某些业务需求 , 就需要我们自己对数据重新进行处理 , 从而获得我们想要的数据结构 。
比如我想获得候选的内容中每个类别是多少数量
下面就是通过某个属性值对「对象数组」进行分组生成「结果对象数组」,一个分类的过程 。
效果
const list = [{id: 1,name: "杨一",position: "前端"},{id: 2,name: "杨二",position: "前端"},{id: 3,name: "杨三",position: "前端"},{id: 4,name: "杨四",position: "后端"},{id: 5,name: "杨五",position: "后端"}, {id: 6,name: "杨六",position: "算法"},{id: 7,name: "杨七",position: "算法"},{id: 8,name: "杨八",position: "算法"},]countSelectedMember(list)
变成
踩坑方法一
const countSelectedMember = (array: any[]): any[] => {const classifiedMember: any[] = [];for (let i = 0; i < array.length; i++) {if (array[i].position === null) continue;//注意脏数据else if (classifiedMember.length == 0) {classifiedMember.push({position: array[i].position,data: [array[i]],});} else {let index: number = classifiedMember.findIndex((item) => item.position == array[i].position,);if (index >= 0) {classifiedMember[index].data.push(array[i]);} else {classifiedMember.push({position: array[i].position,data: [array[i]],});}}}return classifiedMember;};
方法二
const countSelectedMember = (selectedMember: any[]): Map
- 皮蛋黄瓜汤怎么做不腥 皮蛋黄瓜汤怎么做
- 醑怎么读
- 夹馍酱制作方法视频 夹馍酱制作方法
- 冕旒怎么读 珠冠冕旒怎么读
- 北方腊肠的制作方法及配方 腊肠的制作方法及配方
- 水何澹澹怎么读 水何澹澹怎么读粤语
- the怎么读英语 their怎么读英语
- 咙怎么读 喉咙怎么读
- goat怎么读 goose怎么读
- 八宝辣酱的制作方法和配料 八宝辣酱的制作方法