如何合併多個JSON對象中的子項？

Question

我有以下的JavaScript對象

[ 
    { 
    "familyName": "Smith", 
    "children": [ 
     {   "firstName": "John"  }, 
     {   "firstName": "Mike"  } 
    ] 
    }, 
    { 
    "familyName": "Williams", 
    "children": [ 
     {   "firstName": "Mark"  }, 
     {   "firstName": "Dave"  } 
    ] 
    }, 
    { 
    "familyName": "Jones", 
    "children": [ 
     {   "firstName": "Mary"  }, 
     {   "firstName": "Sue"  } 
    ] 
    } 
] 

我想創建所有的孩子即

[ 
    {  "FirstName": "John" }, 
    {  "FirstName": "Mike" }, 
    {  "FirstName": "Mark" }, 
    {  "FirstName": "Dave" }, 
    {  "FirstName": "Mary" }, 
    {  "FirstName": "Sue" } 
] 

我使用jQuery的數組。

我曾看過描述合併或連接數組但不包括子數組的例子的帖子：例如Merge/flatten an array of arrays in JavaScript?

我相信我可以通過家庭循環，並添加兒童陣列，但懷疑這是一個'一班'？

Answer 1

我在控制檯測試：

//The families(duh) 
const families = [ 
{ 
    "familyName": "Smith", 
    "children": [ 
     {   "firstName": "John"  }, 
     {   "firstName": "Mike"  } 
    ] 
    }, 
    { 
    "familyName": "Williams", 
    "children": [ 
     {   "firstName": "Mark"  }, 
     {   "firstName": "Dave"  } 
    ] 
    }, 
    { 
    "familyName": "Jones", 
    "children": [ 
     {   "firstName": "Mary"  }, 
     {   "firstName": "Sue"  } 
    ] 
    } 
] 
//Just flatten the children: 
var children = [].concat.apply([], families.map(family => family.children)); 
//Outputs 
console.log(children); 

Answer 2

您可以通過使用$.map做到這一點：

var a = [ 
    { 
    "familyName": "Smith", 
    "children": [ 
     {   "firstName": "John"  }, 
     {   "firstName": "Mike"  } 
    ] 
    }, 
    { 
    "familyName": "Williams", 
    "children": [ 
     {   "firstName": "Mark"  }, 
     {   "firstName": "Dave"  } 
    ] 
    }, 
    { 
    "familyName": "Jones", 
    "children": [ 
     {   "firstName": "Mary"  }, 
     {   "firstName": "Sue"  } 
    ] 
    } 
] 

console.log($.map(a, function(it){ 
    return it.children; 
})); 

// Or ES6 
$.map(a, it => it.children); 

結果：

[ 
    { 
     "firstName":"John" 
    }, 
    { 
     "firstName":"Mike" 
    }, 
    { 
     "firstName":"Mark" 
    }, 
    { 
     "firstName":"Dave" 
    }, 
    { 
     "firstName":"Mary" 
    }, 
    { 
     "firstName":"Sue" 
    } 
] 

Answer 3

沒有jQuery的一個解決方案是使用reduce從他們的家庭提取的孩子（聽起來有點粗糙，對不起爲了那個原因）。

families.reduce(function(list, family){ 
    return list.concat(family.children); 
}, []); 

Answer 4

與Array#forEach方法試試。於是推孩子用新的數組對象

var families = [ { "familyName": "Smith", "children": [ { "firstName": "John" }, { "firstName": "Mike" } ] }, { "familyName": "Williams", "children": [ { "firstName": "Mark" }, { "firstName": "Dave" } ] }, { "familyName": "Jones", "children": [ { "firstName": "Mary" }, { "firstName": "Sue" } ] } ] 
 
var children = []; 
 
families.forEach(family => family.children.forEach(child => children.push(child))); 
 
console.log(children);