参考资料:
- https://blog.csdn.net/mafan121/article/details/83418116
- https://www.30secondsofcode.org/js/s/group-by
一. 分组方法1
- 可根据匿名函数或者属性名来分组
const groupByMethod1 = (arr, fnOrProperty) => {
return arr.map(typeof fnOrProperty === 'function' ? fnOrProperty : val => val[fnOrProperty])
.reduce((acc, val, i) => {
acc[val] = (acc[val] || []).concat(arr[i]);
return acc;
}, {});
}
二. 分组方法2
- 可根据匿名函数来分组
const groupByMethod2 = (list, fn) => {
const groups = {};
list.forEach(function (o) {
const group = JSON.stringify(fn(o));
groups[group] = groups[group] || [];
groups[group].push(o);
});
return groups;
}
三. 效果
- 数据准备
const studentList = [ { class: '1班', name: '张三', sex: '男' }, { class: '2班', name: '李四', sex: '男' }, { class: '1班', name: '王五', sex: '女' }, { class: '3班', name: '赵六', sex: '男' } ];
- 效果
// ⏹通过属性的方式,按照班级来分组 const group1 = groupByMethod1(studentList, 'class'); console.log(group1); /* { '1班': [ {class: "1班", name: "张三", sex: "男"}, {class: "1班", name: "王五", sex: "女"} ], '2班': [ {class: "2班", name: "李四", sex: "男"} ], '3班': [ {class: "3班", name: "赵六", sex: "男"} ], } */
// ⏹通过匿名函数的方式1,按照性别来分组 const group2 = groupByMethod1(studentList, (item) => item.sex); console.log(group2); /* { 女: [ {class: "1班", name: "王五", sex: "女"} ], 男: [ {class: "1班", name: "张三", sex: "男"}, {class: "2班", name: "李四", sex: "男"}, {class: "3班", name: "赵六", sex: "男"} ], } */ console.log(group2['男']); /* [ {class: "1班", name: "张三", sex: "男"}, {class: "2班", name: "李四", sex: "男"}, {class: "3班", name: "赵六", sex: "男"} ] */
// ⏹通过匿名函数的方式2,按照性别来分组 const group3 = groupByMethod2(studentList, (item) => item.sex); console.log(group3); /* { "女": [ {class: "1班", name: "王五", sex: "女"} ], "男": [ {class: "1班", name: "张三", sex: "男"}, {class: "2班", name: "李四", sex: "男"}, {class: "3班", name: "赵六", sex: "男"} ], } */ // 通过这种方式的key来获取的时候,必须多套一层 '' console.log(group3['"男"']); /* [ {class: "1班", name: "张三", sex: "男"}, {class: "2班", name: "李四", sex: "男"}, {class: "3班", name: "赵六", sex: "男"} ] */