How to flatten an array of objects containing arrays?

Question

I want to flatten the items an array of objects and receive a new result array. How can I achieve it?

This approach did not work:

const group = [{
    idGroup: 1,
    member: [{
      name: "Tim"
    }, {
      name: "Sina"
    }]
  }],
}];

const result = [{
    idGroup: 1,
    name: "Tim"
  },
  {
    idGroup: 1,
    name: "Sina"
  },
]



const result = group.reduce((r, obj) => r.concat(obj.member), []);

console.log(result)

Possible duplicate of Rewrite array based on child array javascript — adiga
– adiga, Commented May 2, 2019 at 9:29

Nina Scholz · Accepted Answer · 2019-05-02 09:27:34Z

2

You could map nested objects.

const
    group = [{ idGroup:1, member: [{ name: "Tim" }, { name: "Sina" }] }];
    result = group.reduce(
        (r, { idGroup, member }) => [...r, ...member.map(({ name }) => ({ idGroup, name }))],
        []
    );

console.log(result);

Or use upcoming Array#flatMap.

const
    group = [{ idGroup:1, member: [{ name: "Tim" }, { name: "Sina" }] }];
    result = group.flatMap(({ idGroup, member }) =>
        member.map(({ name }) => ({ idGroup, name })));

console.log(result);

answered May 2, 2019 at 9:27

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

Comments

Maheer Ali · Accepted Answer · 2019-05-02 09:27:43Z

2

You can use flatMap() and use map() on member array of object.

const group = [
 {
  idGroup:1,
  member: [{name: "Tim"}, {name: "Sina"}],
 }
];

const res = group.flatMap(x => x.member.map(a => ({...a,idGroup:x.idGroup})));
console.log(res)

answered May 2, 2019 at 9:27

Maheer Ali

36.5k8 gold badges53 silver badges83 bronze badges

Comments

Jack Bashford · Accepted Answer · 2019-05-02 09:29:52Z

1

You'd need to use map too (to make the new items):

const group = [{idGroup:1,member:[{name: "Tim"},{name: "Sina"}]}];
const result = group.reduce((acc, { idGroup, member }) => acc.concat(member.map(({ ...props }) => ({ ...props, idGroup }), [])), []);
console.log(result);

answered May 2, 2019 at 9:29

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

Comments

jo_va · Accepted Answer · 2019-05-02 09:31:11Z

1

You can use Array.prototype.reduce() and Array.prototype.forEach() like this:

const group = [{
  idGroup: 1,
  member: [{name: "Tim"}, {name: "Sina"}],
}, {
  idGroup: 2,
  member: [{name: "Jo"}, {name: "Eric"}]
}];

const result = group.reduce((acc, { idGroup, member }) => {
  member.forEach(({ name }) => acc.push({ idGroup, name }));
  return acc;
}, []);

console.log(result);

answered May 2, 2019 at 9:31

jo_va

14.1k3 gold badges25 silver badges49 bronze badges

Comments

Cid · Accepted Answer · 2019-05-02 09:34:10Z

1

A good old loop can work too.

const group =
[{
    idGroup: 1,
    member: [{
      name: "Tim"
    }, {
      name: "Sina"
    }]
},
{
    idGroup: 2,
    member: [{
      name: "foo"
    }, {
      name: "bar"
    }, {
      name: "42"
    }]
}];

let result = [];

group.forEach((elem) => {
  elem.member.forEach((subElem) => {
    result.push({ idGroup: elem.idGroup, name: subElem.name });
  });
});

console.log(result);

answered May 2, 2019 at 9:34

Cid

15.3k4 gold badges33 silver badges49 bronze badges

Collectives™ on Stack Overflow

How to flatten an array of objects containing arrays?

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related