javascript to group array of objects by key

Question

I am trying to group an array of objects like the below using JavaScript.

const array = [
  { 'red':  50 , 'green':99 , 'blue': 66},
  {'blue':65, 'red': 88 }, 
  { 'green':9 , 'blue': 6},
  { 'red':  650 , 'green':959 , 'blue': 663},
];

and expecting the below result,

{
    red: [50, 88, 650],
    green: [99,9,959],
    blue: [66,65, 6, 663]
}

Can we implement this using Reduce function?

Thanks in advance!.

Excuse me if this isn't the case, but your question reads as though you're a student looking for help with an assignment. There's no rule against this, but there are [suggestions](https://meta.stackoverflow.com/a/334823/11751077) that might help you get the sort of response you're looking for. — backtick, Mar 30 '22 at 20:27

Ankit Saxena · Accepted Answer · 2022-03-30T13:48:41.367

You can try the below approach to do so. Hope it helps

Loop through the array and it's items. If the key already exists inside the outputObj object push the new value into the respective array, else simply create a new array with that key and value (outputObj[key] = [item[key]]).

Working code:

const array = [{
    'red': 50,
    'green': 99,
    'blue': 66
  },
  {
    'blue': 65,
    'red': 88
  },
  {
    'green': 9,
    'blue': 6
  },
  {
    'red': 650,
    'green': 959,
    'blue': 663
  },
];

//Method 1
const outputObj = {};

array.forEach(item => {
  Object.keys(item).forEach(key => {
    if (key in outputObj) {
      outputObj[key].push(item[key])
    } else {
      outputObj[key] = [item[key]]
    }
  })
})

console.log(outputObj)

//Method 2
const finalObj = array.reduce((acc, curr) => {
  const obj = Object.keys(acc).length ? acc : {}
  Object.keys(curr).forEach(key => {
    if (key in obj) {
      obj[key].push(curr[key])
    } else {
      obj[key] = [curr[key]]
    }
  })
  return obj;
}, {})

console.log(finalObj)

It helps. Thanks for your effort!. Can we try using reduce function? — Nithya, Mar 30 '22 at 13:22
sure @Nithya. I've updated my answer. pls check (added method 2 - using reduce funcion to do the same thing) — Ankit Saxena, Mar 30 '22 at 13:49

score 1 · Answer 2 · answered Mar 30 '22 at 13:49

  array = [
    { red: 50, green: 99, blue: 66 },
    { blue: 65, red: 88 },
    { green: 9, blue: 6 },
    { red: 650, green: 959, blue: 663 },
  ];
  
  let result = {};
    for (let item of this.array) {
      for (const [key, value] of Object.entries(item)) {
        if (!result.hasOwnProperty(key)) {
          result[key] = [value];
        } else {
          result[key].push(value);
        }
      }
    }
    
    console.log(result);

score 0 · Answer 3 · answered Mar 30 '22 at 13:22

This piece of code will fill the result object grouping values coming from the same key in the array variable:

var result = {};

array.forEach(
  item => Object.keys(item).forEach(
        key => {
            if (result[key] === undefined) result[key] = [];
            result[key].push(item[key]);
        }
  )
)

score 0 · Answer 4 · answered Mar 30 '22 at 13:22

const array = [
  { 'red':  50 , 'green':99 , 'blue': 66},
  {'blue':65, 'red': 88 }, 
  { 'green':9 , 'blue': 6},
  { 'red':  650 , 'green':959 , 'blue': 663},
];

function group(array, result = {}) {
  array.forEach(object => {
    Object.keys(object).forEach(key => {
      if(!result[key]) {
        result[key] = [object[key]];
        return;
      }

      result[key].push(object[key]);
    });
  });

  return result;
}

const result = group(array);

console.log(result);

javascript to group array of objects by key

4 Answers4