Convert array of objects into a single object

Question

I have the following array for example -

[
  {
    name: "abc",
    value: "1"
  },
  {
    name: "xyz",
    value: "2"
  },
  {
    name: "abc",
    value: "3"
  },
  {
    name: "abc",
    value: "4"
  },
  {
    name: "xyz",
    value: "5"
  },
]

Now, I want to reduce this array into a single object by grouping value with the same name together into an array. Something like this -

{
  abc: [1, 3, 4],
  xyz: [2, 5]
}

How do I do this using reduce in JavaScript?

I'm not sure if this the right approach but I have tried something like this and it doesn't give me the desired output.

const data = arr.reduce((acc, item) => {
  return {
    ...acc,
    [item.name]: [item.value, acc[item.value]]
  };
});

please may you share a minimal reproducible example of what you have already tried? — evolutionxbox
– evolutionxbox, Commented May 26, 2022 at 7:07

Nick · Accepted Answer · 2022-05-26 07:27:00Z

3

You were on the right track with your answer, but you need to check if acc already has a key of item.name:

const data = [{
    name: "abc",
    value: "1"
  },
  {
    name: "xyz",
    value: "2"
  },
  {
    name: "abc",
    value: "3"
  },
  {
    name: "abc",
    value: "4"
  },
  {
    name: "xyz",
    value: "5"
  },
]

const result = data.reduce((acc, { name, value }) => ({
  ...acc,
  [name] : [...(acc[name] || []), value]
}), {})

console.log(result)

Note you can use object destructuring to simplify the accumulation code.

edited May 26, 2022 at 7:27

answered May 26, 2022 at 7:14

Nick

147k23 gold badges67 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Carsten Massmann · Accepted Answer · 2022-05-26 07:13:49Z

2

const data=[
  {
name: "abc",
value: "1"
  },
  {
name: "xyz",
value: "2"
  },
  {
name: "abc",
value: "3"
  },
  {
name: "abc",
value: "4"
  },
  {
name: "xyz",
value: "5"
  },
];

const res=data.reduce((a,c)=>{
 (a[c.name]??=[]).push(c.value);
 return a;
},{});
console.log(res);

answered May 26, 2022 at 7:13

Carsten Massmann

28.4k3 gold badges25 silver badges49 bronze badges

4 Comments

Roko C. Buljan Over a year ago

Or with implicit return: data.reduce((a,c)=>((a[c.name]??=[]).push(c.value), a),{});

Carsten Massmann Over a year ago

I know this is a "code only" answer. But its actions are so simple they speak for themselves.

jsN00b Over a year ago

@RokoC.Buljan with destructuring, console.log(data.reduce((a, {name, value}) => ((a[name]??=[]).push(value), a), {}));

Carsten Massmann Over a year ago

In the end it boils down to a question of style: Do I strive for least repetition, shortest code or best readability?

Alok · Accepted Answer · 2022-05-26 07:40:09Z

1

const data = [{
    name: "abc",
    value: "1"
  },
  {
    name: "xyz",
    value: "2"
  },
  {
    name: "abc",
    value: "3"
  },
  {
    name: "abc",
    value: "4"
  },
  {
    name: "xyz",
    value: "5"
  },
];

let finalObject = {};

data.forEach((item) => {
   if (!finalObject.hasOwnProperty(item.name)) {
      finalObject[item.name] = [item.value];
   } else {
      finalObject[item.name].push(item.value);
   }
});
console.log(finalObject);

Just parse values if you need in string to number and it will give you answer

{
  abc: [1, 3, 4],
  xyz: [2, 5]
}

edited May 26, 2022 at 7:40

Alok

9,07814 gold badges63 silver badges104 bronze badges

answered May 26, 2022 at 7:23

Shashank Dubey

3531 gold badge6 silver badges19 bronze badges

Comments

Som Shekhar Mukherjee · Accepted Answer · 2022-05-26 07:49:55Z

You can group the array using Array.prototype.reduce.

const 
  data = [
    { name: "abc", value: "1" },
    { name: "xyz", value: "2" },
    { name: "abc", value: "3" },
    { name: "abc", value: "4" },
    { name: "xyz", value: "5" },
  ],
  result = data.reduce((r, o) => ((r[o.name] ??= []).push(o.value), r), {});

console.log(result);

reduce takes some time to getting used to, but it's fairly simple once it clicks. You can also group the array using a simple for...of loop.

const data = [
  { name: "abc", value: "1" },
  { name: "xyz", value: "2" },
  { name: "abc", value: "3" },
  { name: "abc", value: "4" },
  { name: "xyz", value: "5" },
];

const result = {};
for (let d of data) {
  (result[d.name] ??= []).push(d.value);
}

console.log(result);

Other relevant documentations:

VMT · Accepted Answer · 2022-05-26 11:41:30Z

0

Use reduce():

const arr = [
  {
    name: "abc",
    value: "1"
  },
  {
    name: "xyz",
    value: "2"
  },
  {
    name: "abc",
    value: "3"
  },
  {
    name: "abc",
    value: "4"
  },
  {
    name: "xyz",
    value: "5"
  },
]

const data = arr.reduce((a,c) => ({...a, [c.name]: a[c.name] ? [...a[c.name], c.value] : [c.value]}),{})
console.log(data)

answered May 26, 2022 at 11:41

VMT

8091 gold badge5 silver badges11 bronze badges

Collectives™ on Stack Overflow

Convert array of objects into a single object

5 Answers 5

Comments

4 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

4 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related