重新排列JavaScript對象結構

Question

我在看與以下結構的對象：

[ 
    [ 
    { 
     "attr1":"1", 
     "attr2":"2", 
     "attr3":"3" 
    } 
    ], 
    [ 
    { 
     "attr1":"1", 
     "attr2":"2", 
     "attr3":"3" 
    } 
    ], 
    [ 
    { 
     "attr1":"1", 
     "attr2":"2", 
     "attr3":"3" 
    } 
    ] 
] 

只是着眼於它的結構，所有我需要這個對象做的是重新安排它，使它結束於以下結構：

[ 
    { 
    "attr1":"1", 
    "attr2":"2", 
    "attr3":"3" 
    }, 
    { 
    "attr1":"1", 
    "attr2":"2", 
    "attr3":"3" 
    }, 
    { 
    "attr1":"1", 
    "attr2":"2", 
    "attr3":"3" 
    } 
] 

這是如何在純Javascript或核心jQ庫中完成的？

Answer 1

所以，你只需要刪除第二級陣列。輕鬆完成與Array.map()。

var old = [ 
 
    [ 
 
    { 
 
     "attr1":"1", 
 
     "attr2":"2", 
 
     "attr3":"3" 
 
    } 
 
    ], 
 
    [ 
 
    { 
 
     "attr1":"1", 
 
     "attr2":"2", 
 
     "attr3":"3" 
 
    } 
 
    ], 
 
    [ 
 
    { 
 
     "attr1":"1", 
 
     "attr2":"2", 
 
     "attr3":"3" 
 
    } 
 
    ] 
 
]; 
 

 
// Map loops through an array and returns a new array filled with whatever the 
 
// supplied callback function returns. 
 
var newArry = old.map(function(value){ 
 
    // Get the first object stored in the second-level array, but not the array itself 
 
    return value[0]; 
 
}); 
 

 
console.log(newArry);

Answer 2

Array#reduce可能是有幫助的。

var arr = [[{"attr1":"1","attr2":"2","attr3":"3"}],[{"attr1":"1","attr2":"2","attr3":"3"}],[{"attr1":"1","attr2":"2","attr3":"3"}]], 
 
    res = arr.reduce((a,b) => a.concat(b)); 
 

 
    console.log(res);

Answer 3

你可以使用Array#concat用spread syntax ...。

var data = [[{ attr1: "1", attr2: "2", attr3: "3" }], [{ attr1: "1", attr2: "2", attr3: "3" }], [{ attr1: "1", attr2: "2", attr3: "3" }]], 
 
    flat = [].concat(...data); 
 

 
console.log(flat);

.as-console-wrapper { max-height: 100% !important; top: 0; }

ES5

var data = [[{ attr1: "1", attr2: "2", attr3: "3" }], [{ attr1: "1", attr2: "2", attr3: "3" }], [{ attr1: "1", attr2: "2", attr3: "3" }]], 
 
    flat = [].concat.apply([], data); 
 

 
console.log(flat);

.as-console-wrapper { max-height: 100% !important; top: 0; }