JavaScript：轉換對象結構

Question

我有一個像這樣的對象：

{
  "A": [ "-4927","8779","-9971","-23767" ],
  "B": [ "-10617","-1456","3131","259" ],
  "C": [ "-5185","1168","21501","18989" ],
  "D": [ "2010","5664","2148","-674" ]
}

我想轉換成這個：

[
  {
    name: 'A',
    data: ["-4927","8779","-9971","-23767"]
  }, {
    name: 'B',
    data: ["-10617","-1456","3131","259"]
  }, {
    name: 'C',
    data: ["-5185","1168","21501","18989"]
  }, {
    name: 'D',
    data: ["2010","5664","2148","-674"]
  }
]

我使用了以下方法：

var newData = [];
$.each($.parseJSON(data), function(k, v) {
  newData['name'] = k;
  newData['data'] = v;
});

但它只將最后一個密鑰對值存儲為newData。 那是

name: 'D',
data: ["2010","5664","2148","-674"]

據我所知，它會覆蓋以前的數據並僅存儲它獲得的最后數據。 但我無法解決這個問題。

任何幫助？

Answer 1

您將屬性name和data直接分配給newData而不是將對象作為數組推送到其中：

將你的循環改為：

var newData = [];
$.each($.parseJSON(data), function(k, v) {
        const myNewData = {
            name: k,
            data: v
        }
        newData.push(myNewData);
});

Answer 2

你可以使用map來做到這一點

 const oldData = { "A": [ "-4927","8779","-9971","-23767" ] , "B": [ "-10617","-1456","3131","259" ] , "C": [ "-5185","1168","21501","18989" ] , "D": [ "2010","5664","2148","-674" ] } const newShape = ([ name, data ]) => ({ name, data }) const newData = Object.entries(oldData).map(newShape) console.log(newData) // [ { name: "A", data: [ "-4927","8779","-9971","-23767" ] }, ... ] 

如果願意，你可以編寫lambda內聯，但通常用可重用的部分編寫程序會更好

const newData =
  Object.entries(oldData).map(([ name, data ]) => ({ name, data }))

jQuery可以使用$ .map映射對象 - 注意不同的lambda

const newData =
  $.map(oldData, (data, name) => ({ name, data }))

Answer 3

您可以使用Object.keys和Array.map來生成數組。

它可以翻譯成這樣：

對於我的對象數據中的每個鍵，在新數組中創建一個新項。 此項目將成為一個對象，具有密鑰名稱和密鑰數據。

---

 const data = { A: ['-4927', '8779', '-9971', '-23767'], B: ['-10617', '-1456', '3131', '259'], C: ['-5185', '1168', '21501', '18989'], D: ['2010', '5664', '2148', '-674'], }; const ret = Object.keys(data).map(x => ({ name: x, data: data[x], })); console.log(ret); 

Answer 4

您可以使用for in循環並push每個元素。

 var obj = { "A":["-4927","8779","-9971","-23767"], "B":["-10617","-1456","3131","259"], "C":["-5185","1168","21501","18989"], "D":["2010","5664","2148","-674"] } var newArr = []; for(p in obj){ newArr.push({"name":p,"data":obj[p]}) } console.log(newArr) 

Answer 5

應該：

var newData = [];
$.each($.parseJSON(data), function(k, v) {
    newData.push({'name': k, 'data': v});
});

您也不需要使用jQuery。 你可以在vanilla JS中做同樣的事情：

var newData = [];
Object.keys(data).forEach(function(k) {
    newData.push({'name': k, 'data': data[k]});
});

Answer 6

以下代碼將返回您的預期結果。

var newData = [];
for(var key in data) {
    newData.push({
        name: key,
        data: data[key]
    });
}

Answer 7

如果我們不使用jQuery ，我們可以使用Object.keys（）和Array.prototype.map（）的組合

Object.keys（）方法以與普通循環相同的順序返回給定對象自己的屬性名稱的數組。

Object.keys(data)只返回["A", "B", "C", "D"]

---

map（）方法創建一個新數組，其結果是在調用數組中的每個元素上調用提供的函數。

在該map函數回調中，我們可以以我們需要格式化數據的特定方式返回一個對象。

 const data = { "A": ["-4927", "8779", "-9971", "-23767"], "B": ["-10617", "-1456", "3131", "259"], "C": ["-5185", "1168", "21501", "18989"], "D": ["2010", "5664", "2148", "-674"] } const newData = Object.keys(data).map(function(prop) { return { name: prop, data: data[prop] } }) console.log(newData)