使用jQuery將對象轉換爲另一個對象

Question

我在我想要轉換爲另一個對象的JavaScript文件中獲取結果。

我原來的結果

[ 
    { 
    "SName": "Set1", 
    "Elements": [ 
     { 
     "Id": "3", 
     "Name": "Name1" 
     }, 
     { 
     "Id": "5", 
     "Name": "Name2" 
     } 
    ] 
    }, 
    { 
    "SName": "Set2", 
    "Elements": [ 
     { 
     "Id": "7", 
     "Name": "Name3" 
     }, 
     { 
     "Id": "8", 
     "Name": "Name4" 
     } 
    ] 
    } 
] 

轉換這個看起來像使用jQuery或JavaScript對象的數組。我怎樣才能做到這一點？

[ 
    { 
    "SName": "Set1", 
    "Id": 3, 
    "Name": "Name1" 
    }, 
    { 
    "SName": "Set1", 
    "Id": 5, 
    "Name": "Name2" 
    }, 
    { 
    "SName": "Set2", 
    "Id": 7, 
    "Name": "Name3" 
    }, 
    { 
    "SName": "Set2", 
    "Id": 8, 
    "Name": "Name4" 
    } 
] 

Answer 1

var data =  [ 
    { 
    "SName": "Set1", 
    "Elements": [ 
     { 
     "Id": "3", 
     "Name": "Name1" 
     }, 
     { 
     "Id": "5", 
     "Name": "Name2" 
     } 
    ] 
    }, 
    { 
    "SName": "Set2", 
    "Elements": [ 
     { 
     "Id": "7", 
     "Name": "Name3" 
     }, 
     { 
     "Id": "8", 
     "Name": "Name4" 
     } 
    ] 
    } 
]; 
console.log(data); 

var newData = data.reduce(function (newArray, currentSet) { 
    return newArray.concat(currentSet.Elements.map(function (element) { 
     return Object.assign({ SName: currentSet.SName }, element); 
    })); 
}, []); 

console.log(newData); 

這裏的關鍵是reduce功能。我們正在做的是通過遍歷外部數組的每個值來創建一個全新的數組。我們連續使用concat將我們映射到內部數組的值插入到新數組中。

Answer 2

你可以遍歷數組，該Elements和性能，並建立一個新的對象，並將它推到結果集。

var array = [{ "SName": "Set1", "Elements": [{ "Id": "3", "Name": "Name1" }, { "Id": "5", "Name": "Name2" }] }, { "SName": "Set2", "Elements": [{ "Id": "7", "Name": "Name3" }, { "Id": "8", "Name": "Name4" }] }], 
 
    result = []; 
 

 
array.forEach(function (a) { 
 
    a.Elements.forEach(function (b) { 
 
     var o = { SName: a.SName }; 
 
     Object.keys(b).forEach(function (k) { 
 
      o[k] = b[k]; 
 
     }); 
 
     result.push(o); 
 
    }); 
 
}); 
 

 
console.log(result);

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

ES6

var array = [{ "SName": "Set1", "Elements": [{ "Id": "3", "Name": "Name1" }, { "Id": "5", "Name": "Name2" }] }, { "SName": "Set2", "Elements": [{ "Id": "7", "Name": "Name3" }, { "Id": "8", "Name": "Name4" }] }], 
 
    result = []; 
 

 
array.forEach(a => a.Elements.forEach(b => result.push(Object.assign({ SName: a.SName }, b)))); 
 

 
console.log(result);

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

Answer 3

您可以reduce()，forEach()和Object.assign()

做到這一點210

var data = [{ 
 
    "SName": "Set1", 
 
    "Elements": [{ 
 
    "Id": "3", 
 
    "Name": "Name1" 
 
    }, { 
 
    "Id": "5", 
 
    "Name": "Name2" 
 
    }] 
 
}, { 
 
    "SName": "Set2", 
 
    "Elements": [{ 
 
    "Id": "7", 
 
    "Name": "Name3" 
 
    }, { 
 
    "Id": "8", 
 
    "Name": "Name4" 
 
    }] 
 
}] 
 

 
var result = data.reduce(function(r, e) { 
 
    e.Elements.forEach(function(o) { 
 
    r.push(Object.assign({SName: e.SName}, o)) 
 
    }) 
 
    return r; 
 
}, []) 
 

 
console.log(result)

Answer 4

下面是使用jQuery的解決方案，在這裏的jsfiddle：

https://jsfiddle.net/noitse/3uk9qjnf/

我希望你知道所有關鍵的名稱，以便它不會是問題，做固定。

var json = [ 
    { 
    "SName": "Set1", 
    "Elements": [ 
     { 
     "Id": "3", 
     "Name": "Name1" 
     }, 
     { 
     "Id": "5", 
     "Name": "Name2" 
     } 
    ] 
    }, 
    { 
    "SName": "Set2", 
    "Elements": [ 
     { 
     "Id": "7", 
     "Name": "Name3" 
     }, 
     { 
     "Id": "8", 
     "Name": "Name4" 
     } 
    ] 
    } 
] 

var newJSON = [] 

$(json).each(function(index,value){ 

    $(value.Elements).each(function(index1,value1){ 
     newJSON.push({"SName":value.SName,"Id":value1.Id,"Name":value1.Name}) 
}) 

}) 

alert(JSON.stringify(newJSON)) 

下面是代碼，它做什麼，它遍歷第一JSON，然後通過它的元素循環，然後把它推到新陣列

Answer 5

你可以使用$ .extend方法，它可以讓你創建一個對象的副本，同時與另一個對象合併。您可以運行代碼in this fiddle。