Segregate an array based on same name

Question

I have an array with multiple objects having the same name. How can I segregate the array based on the name?

I tried with map, filter but didn't work finally I used reduce also but not getting the output.

 const result = Object.values(this.optionsArr.reduce((a, c) => {
        a[c.name] = a[c.name] || {name: c.name};
        a[c.name].options.push(c.options);
        return a;
      }, {})).map(item => ({...item, accessDetails: Object.values(item.accessDetails)}));

INPUT:

[{name: "audio", options:{name:'true', value: 'T'}},
{name: "audio", options:{name:'false', value: 'F'}},
{name: "audio", options:{name:'yes', value: 'Y'}},
{name: "video", options:{name:'true', value: 'T'}},
{name: "video", options:{name:'yes', value: 'Y'}},
{name: "video", options:{name:'false', value: 'F'}},
{name: "call", options:{name:'true', value: 'T'}},
{name: "call", options:{name:'No', value: 'N'}},
{name: "call", options:{name:'false', value: 'F'}}]

Expected Output

 [{name: "audio", options:[{name:'true', value: 'T'},{name:'false', value: 'F'},{name:'yes', value: 'Y'}]},
    {name: "video", options:[{name:'true', value: 'T'},{name:'false', value: 'F'},{name:'yes', value: 'Y'}]},
    {name: "call", options:[{name:'true', value: 'T'},{name:'false', value: 'F'},{name:'yes', value: 'Y'}]}]

What have you tried so far ? Please add your try to achieve this - Thanks. — Always Helping, Sep 11 '20 at 13:31
You are looking for group by function. Look at this: https://stackoverflow.com/questions/40774697/how-to-group-an-array-of-objects-by-key/40774759#40774759 — miguelrocha19, Sep 11 '20 at 13:34

Unmitigated · Accepted Answer · 2020-09-11T14:02:19.297

You can perform a reduce operation using an object to store elements with the same name.

const arr = [{name: "audio", options:{name:'true', value: 'T'}},
{name: "audio", options:{name:'false', value: 'F'}},
{name: "audio", options:{name:'yes', value: 'Y'}},
{name: "video", options:{name:'true', value: 'T'}},
{name: "video", options:{name:'yes', value: 'Y'}},
{name: "video", options:{name:'false', value: 'F'}},
{name: "call", options:{name:'true', value: 'T'}},
{name: "call", options:{name:'No', value: 'N'}},
{name: "call", options:{name:'false', value: 'F'}}];
const res = Object.values(arr.reduce((acc,{name, options})=>{
  acc[name] = acc[name] || {name, options: []};
  acc[name].options.push(options);
  return acc;
}, {}));
console.log(res);

it is coming as object of object, can u help me to push into an array all these objects... can u chk the expected output — Vishnu Shenoy, Sep 11 '20 at 13:48

score 0 · Answer 2 · answered Sep 11 '20 at 13:52

You're on the right track using reduce, but instead of reducing to an Object, you can reduce and push items onto an Array, which should give you the output you need:

this.optionsArr.reduce((p, c) => {
   if (!p.some(a => a.name === c.name)) {
        p.push({ name: c.name, options: []});
   }
   p.find(a => a.name === c.name).options.push(c.options);
   return p;
}, []);

score 0 · Answer 3 · answered Sep 11 '20 at 14:02

Your code is almost correct, you just forgot to initiate options as an empty array, so the push can work:

add , options: [] to the first inline inside the reduce function

 const result = Object.values(this.optionsArr.reduce((a, c) => {
        a[c.name] = a[c.name] || {name: c.name, options: []};
        a[c.name].options.push(c.options);
        return a;
      }, {})).map(item => ({...item, accessDetails: Object.values(item.accessDetails)}));

Peter Seliger · Answer 4 · 2020-09-11T15:45:30.987

This approach is a mix of a generic reduce function that will group any data-item by a given key (via configuration) and a task specific merge function that is specific for e.g. the OP's goal of how to process the properties of any data-item that is going to be merged into its belonging/related group. This method as well gets provided via the initial configuration of the reduce process ...

//  reduce function that groups
//  any data item generically by key.
function groupByKeyAndMergeProperties(collector, item) {
  const { merge, key, index, list } = collector;
  const groupKey = item[key];

  let groupItem = index[groupKey];
  if (!groupItem) {

    //  use `Object.assign` initially in order
    //  to not mutate the original (list's) reference.
    groupItem = index[groupKey] = Object.assign({}, item);
    list.push(groupItem);

    merge(groupItem, null);
  } else {
    merge(groupItem, item);
  }
  return collector;
}

//  task specific merge function,
//  here, according to the OP's goal.
function mergeItemOptions(targetItem, sourceItem) {
  if (sourceItem === null) {
    targetItem.options = [targetItem.options];
  } else {
    targetItem.options.push(sourceItem.options);
  }
}


const sampleList = [
  {name: "audio", options:{name:'true', value: 'T'}},
  {name: "audio", options:{name:'false', value: 'F'}},
  {name: "audio", options:{name:'yes', value: 'Y'}},
  {name: "video", options:{name:'true', value: 'T'}},
  {name: "video", options:{name:'yes', value: 'Y'}},
  {name: "video", options:{name:'false', value: 'F'}},
  {name: "call", options:{name:'true', value: 'T'}},
  {name: "call", options:{name:'No', value: 'N'}},
  {name: "call", options:{name:'false', value: 'F'}}
];

console.log(
  sampleList.reduce(groupByKeyAndMergeProperties, {

    // task specific reduce configuration.
    merge: mergeItemOptions,
    key: 'name',
    index: {},
    list: []

  }).list
);

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

Segregate an array based on same name

4 Answers4

Linked