Combine All Array Inside of Arrays

Question

I have a problem on combining arrays that I wanted to get that's coming from another array.

datas

 datas = [
 {
 "id": "22333",
 "name": "",
 "details": [
 {
 "value": 1
 },
 {
 "value": 2
 }
 ]
 },
 {
 "id": "4444",
 "name": "",
 "details": [
 {
 "value": 99
 },
 {
 "value": 66
 }
 ]
 }
 ]

expected output

final = [
 {
 "value": 1
 },
 {
 "value": 2
 },
 {
 "value": 99
 },
 {
 "value": 66
 }
 ]

Code

 datas.map((data) => ({ ...data.details}))

Answer 1

Replace map with flatMap.

The flatMap method returns a new array formed by applying a given callback function to each element of the array, and then flattening the result by one level. It is identical to a map followed by a flat of depth 1, but slightly more efficient than calling those two methods separately.

const datas=[{id:"22333",name:"",details:[{value:1},{value:2}]},{id:"4444",name:"",details:[{value:99},{value:66}]}];
 
const flattened = datas.flatMap(obj => obj.details);
console.log(flattened);

To get the actual numbers map over the details array.

const datas=[{id:"22333",name:"",details:[{value:1},{value:2}]},{id:"4444",name:"",details:[{value:99},{value:66}]}];
 
const flattened = datas.flatMap(obj => {
 return obj.details.map(el => el.value);
});
console.log(flattened);

• Joseph: How about getting the value only? Like [2, 99, 66]. I did const flattened = datas.flatMap(obj => obj.details.value); but it got undefined.
• Andy: See the updated answer @Joseph

Answer 2

datas.reduce((acc, val) => {
 return acc.concat(val.details)
}, [])

Answer 3

You can also make use of reduce here:

arr.reduce((acc, curr) => {
 acc.push(...curr.details);
 return acc;
}, [])

const arr = (datas = [
 {
 id: "22333",
 name: "",
 details: [
 {
 value: 1,
 },
 {
 value: 2,
 },
 ],
 },
 {
 id: "4444",
 name: "",
 details: [
 {
 value: 99,
 },
 {
 value: 66,
 },
 ],
 },
]);
const result = arr.reduce((acc, curr) => {
 acc.push(...curr.details);
 return acc;
}, []);
console.log(result);