How to combine object key/value into single array?

Question

I have a javascript object with several keys whose values are arrays of objects. I am trying to combine all key/values into a single array of objects. So from

{
    a: [{}, {}, {}],
    b: [{}, {}, {}],
    c: [{}, {}, {}]
}

To

[{}, {}, {}, {}, {}, ...]

I am trying something like

Object.keys(myObject).map(key => myObject[key])

Which results in an array with 3 arrays inside.

I have also tried using using lodash and doing

Object.keys(myObject).map(key => _.values(myObject[key]))

Which seems to result in the same thing. How can I properly do this? Preferably in a single line like I am attempting instead of a loop. Sorry if this is asked already, I don't know how to word the question to find a result

Single array of objects like mentioned in question. Edited question to visually show desired result also — quirky purple
– quirky purple, Commented Jan 17, 2018 at 16:25

gyre · Accepted Answer · 2018-01-22 20:39:37Z

4

You could concat the values of the object.

var object = { a: [{}, {}, {}], b: [{}, {}, {}], c: [{}, {}, {}] },
    array = [].concat(...Object.values(object));

console.log(array);

edited Jan 22, 2018 at 20:39

gyre

16.8k4 gold badges40 silver badges47 bronze badges

answered Jan 17, 2018 at 16:28

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

3 Comments

kLabz Over a year ago

Indeed, Object.values() is better here :)

Dhaval Over a year ago

Not supported in ie, link

Nina Scholz Over a year ago

@Dhaval, the question has an arrow function inside, so op is using ES6.

kLabz · Accepted Answer · 2018-01-17 16:27:18Z

2

You can use Array.prototype.reduce to generate an array with all the nested objects (only one level of nesting is handled here, I don't know how much you want).

var values = {
    a: [{}, {}, {}],
    b: [{}, {}, {}],
    c: [{}, {}, {}]
};

Object.keys(values).reduce(function(res, key) {
    return res.concat(values[key]);
}, []); // [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]

edited Jan 17, 2018 at 16:27

answered Jan 17, 2018 at 16:25

kLabz

1,8271 gold badge16 silver badges14 bronze badges

1 Comment

Icepickle Over a year ago

save some typing by using arrow function and concat instead (inside the reduce), eg: reduce( (current, item) => current.concat( values[item] ) )

Rafael Quintanilha · Accepted Answer · 2018-01-17 16:31:54Z

1

In ES6, if keys are known, you can simply do:

const array = [...obj.a, ...obj.b, ...obj.c];

edited Jan 17, 2018 at 16:31

answered Jan 17, 2018 at 16:28

Rafael Quintanilha

1,44211 silver badges10 bronze badges

2 Comments

kLabz Over a year ago

This would imply knowing the keys in advance, though.

quirky purple Over a year ago

Right. Good suggestion but I wont always know the keys

T.Liu · Accepted Answer · 2018-01-17 16:35:35Z

0

You could concatenate arrays in JavaScript. Here is a solution to your question:

var data = {
    a: [{}, {}, {}],
    b: [{}, {}, {}],
    c: [{}, {}, {}]
}

var result = [];

for (var key in data ){
   result = result.concat(data [key]);
}

console.log(result);

answered Jan 17, 2018 at 16:35

T.Liu

5121 gold badge5 silver badges17 bronze badges

Collectives™ on Stack Overflow

How to combine object key/value into single array?

4 Answers 4

3 Comments

1 Comment

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related