javascript - 使用键将数组中的对象分组并形成新的数组对象

Question

下面是我的数组对象

[{ role : 'Role 1', name: 'A', slid: 'a'}, {role : 'Role 1', name: 'B',slid: 'b'}, {role : 'Role 2', name: 'X', slid: 'x'}, {role : 'Role 2',name: 'Y', slid: 'y'},{role : 'Role 3',name: 'Z',slid: 'z'}]

如何使用 Angular 色将数组中的对象组合起来，形成如下格式的新数组对象。

[{role : 'Role 1', list: [{name: 'A', slid: 'a'}, {name: 'B', slid: 'b'}]},
 {role : 'Role 2', list: [{name: 'X, slid: 'x'}, {name: 'Y', slid: 'y'}]},
 {role : 'Role 3', list: [{name: 'Z', slid: 'z'}]}]

我研究了很多例子，但找不到解决方案。

Answer 1

您可以使用reduce 将数组分组为一个对象。使用 Object.values 将对象转换为数组。

var arr = [{"role":"Role 1","name":"A","slid":"a"},{"role":"Role 1","name":"B","slid":"b"},{"role":"Role 2","name":"X","slid":"x"},{"role":"Role 2","name":"Y","slid":"y"},{"role":"Role 3","name":"Z","slid":"z"}];

var result = Object.values(arr.reduce((c, {role,...r}) => {
  c[role] = c[role] || {role,list: []};
  c[role].list.push(r);
  return c;
}, {}));

console.log( result );