javascript数组按属性分组实现方法

2023-08-30  本文已影响0人  扶得一人醉如苏沐晨

背景

在开发过程中,前端有时需要对后端返回的数据进行一些处理,当后端返回给我们json对象数组时,我们可能会需要按照对象中的某一个属性来进行分组

一、forEach实现

let arr = [
    {name: '张三', age: 18},
    {name: '李四', age: 20},
    {name: '王五', age: 18},
    {name: '赵六', age: 20},
    {name: '孙七', age: 21},
];
let obj = {};
arr.forEach(item => {
    if (!obj[item.age]) {
        obj[item.age] = [];
    }
    obj[item.age].push(item);
});
console.log(obj);
// {
//   18: [{name: '张三', age: 18}, {name: '王五', age: 18}],
//   20: [{name: '李四', age: 20}, {name: '赵六', age: 20}],
//   21: [{name: '孙七', age: 21}],
// }

二、reduce实现

const people = [  
{ name: 'Alice', gender: 'female' },  
{ name: 'Bob', gender: 'male' },  
{ name: 'Charlie', gender: 'male' },  
{ name: 'Diana', gender: 'female' },
];

const groups = people.reduce((groups, person) => {
  const key = person.gender;
  if (!groups[key]) {
    groups[key] = [];
  }
  groups[key].push(person);
  return groups;
}, {});

console.log(groups);
// Output:
// {
//   female: [
//     { name: 'Alice', gender: 'female' },
//     { name: 'Diana', gender: 'female' },
//   ],
//   male: [
//     { name: 'Bob', gender: 'male' },
//     { name: 'Charlie', gender: 'male' },
//   ],
// }

三、对没有属性名的数组进行分组


上一篇下一篇

猜你喜欢

热点阅读