javascript - grouping objects by properties

Question

my question is somewhat similar to javascript | Object grouping .

my input obj is

[
  {
    "name":"Display",
    "group":"Technical detals",
    "id":"60",
    "value":"4"
  },
  {
    "name":"Manufacturer",
    "group":"Manufacturer",
    "id":"58",
    "value":"Apple"
  },
  {
    "name":"OS",
    "group":"Technical detals",
    "id":"37",
    "value":"Apple iOS"
  }
]

and my required output is

 [
  {
    "name":"Display",
    "group":"Technical detals",
    "id":"60",
    "value":"4"
  },
  {
    "name":"OS",
    "group":"Technical detals",
    "id":"37",
    "value":"Apple iOS"
  },
  {
    "name":"Manufacturer",
    "group":"Manufacturer",
    "id":"58",
    "value":"Apple"
  }

]

when i tried to implement the answer ,i got

[[[object Object] {
  group: "Technical detals",
  id: "60",
  name: "Display",
  value: "4"
}, [object Object] {
  group: "Technical detals",
  id: "37",
  name: "OS",
  value: "Apple iOS"
}], [[object Object] {
  group: "Manufacturer",
  id: "58",
  name: "Manufacturer",
  value: "Apple"
}]]

i don't want to group my objects with same property into a single array . i couldn't find out where they are pushing it into array. help me to Fix it :(

what is the difference between input and output, despite of the order? — Nina Scholz, Mar 31 '17 at 08:33
Are you trying to sort your array ? based on which property ? — Weedoze, Mar 31 '17 at 08:37
No . I am trying to group the objects . something like all objects that comes under group technical details should be placed next to next so that when I display it in table all the items will be in next next row — Karthi, Mar 31 '17 at 08:43

Nina Scholz · Accepted Answer · 2017-03-31T18:28:02.123

You could group the items and the concat all groups in a single array.

It works by generating an object with the group as property an the items as items in the array.

In the next step, the object's values are taken and a new array is generated by concatination of the items with Array#reduce.

{                                                                              // hash
    "Technical detals": [
        {
            name: "Display",
            group: "Technical detals",
            id: "60",
            value: "4"
        },
        {
            name: "OS",
            group: "Technical detals",
            id: "37",
            value: "Apple iOS"
        }
    ],
    Manufacturer: [
        {
            name: "Manufacturer",
            group: "Manufacturer",
            id: "58",
            value: "Apple"
        }
    ]
}

var data = [{ name: "Display", group: "Technical detals", id: "60", value: "4" }, { name: "Manufacturer", group: "Manufacturer", id: "58", value: "Apple" }, { name: "OS", group: "Technical detals", id: "37", value: "Apple iOS" }],
    groups = Object.create(null),
    result = [];

data.forEach(function (a) {
    groups[a.group] = groups[a.group] || [];
    groups[a.group].push(a);    
});

result = Object.keys(groups).reduce(function (r, k) {
    return r.concat(groups[k]);
}, []);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Or just sort by group.

var data = [{ name: "Display", group: "Technical detals", id: "60", value: "4" }, { name: "Manufacturer", group: "Manufacturer", id: "58", value: "Apple" }, { name: "OS", group: "Technical detals", id: "37", value: "Apple iOS" }];

data.sort(function (a, b) {
    return a.group.localeCompare(b.group);
});

console.log(data);

.as-console-wrapper { max-height: 100% !important; top: 0; }

perfect one !! Can you elaborate the steps you actually performing .. Everything seems Greek and Latin to me — Karthi, Mar 31 '17 at 16:43

score 0 · Answer 2 · answered Mar 31 '17 at 11:48

Without sorting you may group by the provided property (by) as follows;

function quasiSort(a,by){
  var h = a.reduce((h,e) => h[e[by]] ? (h[e[by]].push(e), h)
                                     : (h[e[by]] = [e], h), {});
  return Object.keys(h).reduce((r,k) => r.concat(h[k]),[]);
}
var data = [{ "name":"Display",
             "group":"Technical detals",
                "id":"60",
             "value":"4"
            },
            { "name":"Manufacturer",
             "group":"Manufacturer",
                "id":"58",
             "value":"Apple"
            },
            { "name":"OS",
             "group":"Technical detals",
                "id":"37",
             "value":"Apple iOS"
            }
           ];
           
console.log(quasiSort(data,"group"));

javascript - grouping objects by properties

2 Answers2

Linked

Related