Convert Object which has value an Array to another Array of Object

Question

I have this kind of object:


{
    "John":[
        {
            "address":"xxx1",
            "city":"yyy1"
        },
        {
            "address":"xxx2",
            "city":"yyy2"
        }
        
    ],
    
    "Doe":[
        {
            "address":"aaaa1",
            "city":"aaa1"
        }
        
    ],

    "Smith":[
        {
            "address":"bbb1",
            "city":"bbb1"
        }
    ],

}

What I try to achieve is to reduce this object so it look like this:

[
{
    "name":"John",
    "address":"xxx1",
    "city":"yyy1"
},
{
    "name":"John",
    "address":"xxx2",
    "city":"yyy2"
},
{
    "name":"Doe",
    "address":"aaaa1",
    "city":"aaaa1"
},
{
    "name":"Smith",
    "address":"bbb1",
    "city":"bbb1"
}
]

But I'm sure that the same thing can be done somehow by using the ES6 array.reduce. Can you help me? I looked at JS (ES6): Reduce array based on object attribute but I can't figure it out.

const modifiedData = Object.entries(data).reduce(function (acc, [key,value]) {
      const personName = key;
      return [
        ...acc,
        {
          Agent: personName ,
          adress: value.adress

        },
      ];
    }, []);

Use .flatMap() to iterate over the result of Object.entries() and in the callback use .map() to create new objects with the given properties + the name. — Andreas
– Andreas, Commented Apr 14, 2021 at 9:43

DecPK · Accepted Answer · 2021-04-14 09:51:43Z

1

You can achieve this using reduce.

const obj = {
  John: [
    {
      address: "xxx1",
      city: "yyy1",
    },
    {
      address: "xxx2",
      city: "yyy2",
    },
  ],

  Doe: [
    {
      address: "aaaa1",
      city: "aaa1",
    },
  ],

  Smith: [
    {
      address: "bbb1",
      city: "bbb1",
    },
  ],
};

const result = Object.entries(obj).reduce((acc, [key, arr]) => {
  const collection = arr.map((a) => ({ name: key, ...a }));
  acc = [...acc, ...collection];
  return acc;
}, []);

console.log( result );

answered Apr 14, 2021 at 9:51

DecPK

25.4k6 gold badges32 silver badges46 bronze badges

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

Comments

Nguyễn Văn Phong · Accepted Answer · 2021-04-14 09:56:24Z

0

The simple way like this.

const data = {"John":[{"address":"xxx1","city":"yyy1"},{"address":"xxx2","city":"yyy2"}],"Doe":[{"address":"aaaa1","city":"aaa1"}],"Smith":[{"address":"bbb1","city":"bbb1"}],};;

const result = Object.entries(data).flatMap(([key, values]) => 
                                   values.map(o => ({name: key, ...o})));
console.log(result);

answered Apr 14, 2021 at 9:56

Nguyễn Văn Phong

14.2k19 gold badges47 silver badges65 bronze badges

1 Comment

Dazzy Over a year ago

@Nguyen, Your solution is good too, but decpk's solution was first and it fits my needs so I accepted his answer. Thanks!

secan · Accepted Answer · 2021-04-14 10:03:11Z

If you want to do it using Array.prototype.reduce, you can do something like this:

const input = {
  "John": [{
      "address": "xxx1",
      "city": "yyy1"
    },
    {
      "address": "xxx2",
      "city": "yyy2"
    }

  ],
  "Doe": [{
      "address": "aaaa1",
      "city": "aaa1"
    }

  ],
  "Smith": [{
    "address": "bbb1",
    "city": "bbb1"
  }],
}

// 1. Using Object.keys()
const output1 = Object.keys(input).reduce((acc, person) => {
  input[person].forEach(item => {
    acc.push({ name: person, ...item })
  })
  return acc;
}, []);
console.log('output1:', output1)

// 2. Using Object.entries()
const output2 = Object.entries(input).reduce((acc, [key, value]) => {
  value.forEach(item => {
    acc.push({ name: key, ...item })
  });
  return acc;
}, [])
console.log('output2:', output2);

Collectives™ on Stack Overflow

Convert Object which has value an Array to another Array of Object

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related