如何对字典数组中的内容进行分组？答案

【问题标题】：How to group contents in an array of dictionary?如何对字典数组中的内容进行分组？
【发布时间】：2019-10-14 02:44:17
【问题描述】：

我知道这可以从后端轻松解决，但很想知道是否有任何有效的方法可以使用 js 从前端解决此问题。

我有一个数组

[
 {  
    id: 11
    ruleDesc: "rule 1 "
 },
{  
    id: 15
    ruleDesc: "rule 2 "
 },
{  
    id: 12
    ruleDesc: "rule 3 "
 },
{  
    id: 11
    ruleDesc: "rule 4 "
 },
{  
    id: 11
    ruleDesc: "rule 5 "
 },

]

我期待的是

[
  {  
        id: 11
        ruleDesc: "rule 1 "
        ruleDesc: "rule 4 "
        ruleDesc: "rule 5 "
     },
{  
        id: 12
        ruleDesc: "rule 3 "
     },
{  
        id: 15
        ruleDesc: "rule 2 "
     },
]

【问题讨论】：

在您预期的输出中，第一个对象包含重复键。最后一个将覆盖所有。
对象键是唯一的，但您预期的结构多次具有相同的键。
对象不能有重复的属性，如果你想在一个对象中有多个ruleDesc你需要使用一个数组
Most efficient method to groupby on a array of objects的可能重复
你自己试过什么？

标签： javascript arrays reactjs algorithm sorting

【解决方案1】：

您需要为同一组创建一个ruleDesc 数组。因为一个对象不能有相同的键。

您可以使用reduce() 获取对象，然后使用Object.values 获取数组。

const arr = [ { id: 11, ruleDesc: "rule 1 " }, { id: 15, ruleDesc: "rule 2 " }, { id: 12, ruleDesc: "rule 3 " }, { id: 11, ruleDesc: "rule 4 " }, { id: 11, ruleDesc: "rule 5 " } ]

const res = arr.reduce((ac,{id,ruleDesc}) => {
  ac[id] = ac[id] || {id,ruleDesc:[]}
  ac[id].ruleDesc.push(ruleDesc);
  return ac;
},{})
console.log(Object.values(res))

【讨论】：

【解决方案2】：

这类似于 Masheer Ali 的回答，但我认为减少的更好一点：

const transform = arr => Object .values (arr .reduce ((a, {id, ruleDesc}) => 
  ({...a, [id]: {id, ruleDesc: [...( (a [id] || {}) .ruleDesc || [] ), ruleDesc]}}),
  {}
))

const rules = [{id: 11, ruleDesc: "rule 1 "}, {id: 15, ruleDesc: "rule 2 "}, {id: 12, ruleDesc: "rule 3 "}, {id: 11, ruleDesc: "rule 4 "}, {id: 11, ruleDesc: "rule 5 "}]

console .log (
  transform (rules)
)

一个优点是，如果您有其他要合并的属性，只需稍作调整：

const transform = arr => Object .values (arr .reduce ((a, {id, ruleDesc, ...rest}) => 
  ({...a, [id]: {...(a[id] || {}), id,  ruleDesc: [...((a[id] || {}).ruleDesc || []) , ruleDesc], ...rest}}),
  {}
))

【讨论】：