将数组中的元素进行分组,暂时了解到有两种简便的方法。
将如下数组按照gender属性进行分组
const persons = [
{name: "张三", gender: "男"},
{name: "李四", gender: "女"},
{name: "王五", gender: "女"},
{name: "郑六", gender: "男"},
{name: "马七", gender: "女"},
];
第一种
使用js中的reduce方法
const result = persons.reduce((resultObj, person) => {
if(!resultObj[person.gender]){
resultObj[person.gender] = []
}
resultObj[person.gender].push(person)
return resultObj
}, {});
console.log(result);
//结果如下:
/**
{
'男': [ { name: '张三', gender: '男' }, { name: '郑六', gender: '男' } ],
'女': [
{ name: '李四', gender: '女' },
{ name: '王五', gender: '女' },
{ name: '马七', gender: '女' }
]
}*/
第二种
使用lodash库中的groupBy方法
import { groupBy } from 'lodash';
const result = groupBy(persons, 'gender');
//结果如下:
/**
{
'男': [ { name: '张三', gender: '男' }, { name: '郑六', gender: '男' } ],
'女': [
{ name: '李四', gender: '女' },
{ name: '王五', gender: '女' },
{ name: '马七', gender: '女' }
]
}*/
这个方法也可以按照不同的条件去对数组进行分组,如下:
const users = ['eight', 'nine', 'four', 'seven'];
const grouped_data = groupBy(users, 'length');
console.log(grouped_data);
//结果如下:
/**
{'4': ['nine', 'four'], '5': ['eight', 'seven']}
*/
const nums = [6.5, 4.12, 6.8, 5.4];
const grouped_data = groupBy(nums, Math.floor);
console.log(grouped_data);
//结果如下:
/**
{'4': [4.12], '5': [5.4], '6': [6.5, 6.8]}
*/