Combine nested arrays into one?

Question

Let's say I have an array of objects that look similar to this:

[
   {
     id: ...,
     name: "...",
     users: [1, 2, 3]
    },
    ...
]

Is there a way that I can easily merge the .users array of each object into one array?

Answer 1

Pluck 'n' flatten will do what you want:

var result = _.flatten(_.pluck(data, 'users'));

Edit

As Richard points out, pluck was removed from lodash in version 4.0.0 but still remains in the current version of underscore at time of writing (1.8.3).

Replacing pluck with map works for both lodash and underscore:

var result = _.flatten(_.map(data, 'users'));

Answer 2

Do not know lodash or underscore, but you can use the native forEach and concat methods of Array (underscore may have equivalent methods, and polyfills for older browsers)

var data = [{
     id: ...,
     name: "...",
     users: [1, 2, 3]
    },
    ...
];
var allUsers = [];
data.forEach(function(obj){
   allUsers = allUsers.concat(obj.users);
});

console.log(allUsers);

Demo

var data = [{
     id: 1,
     name: "...",
     users: [1, 2, 3]
    },
    {
     id: 2,
     name: "....",
     users: [4, 5, 6]
    },
    {
     id: 3,
     name: "...",
     users: [7, 8, 9]
    },            
];
var allUsers = [];
data.forEach(function(obj){
   allUsers = allUsers.concat(obj.users);
});

document.querySelector("#log").innerHTML = allUsers.join(",");

<div id="log"></div>