如何在 JavaScript 中重构 JSON？答案

【问题标题】：How to restructure JSON in JavaScript?如何在 JavaScript 中重构 JSON？
【发布时间】：2018-02-09 05:03:41
【问题描述】：

我有一个特定结构的 JSON 文件（参见示例 A），但我也需要它的结构类似于示例 B。

是否可以在 JS 中重新组织数据？如果是这样，你会怎么做？

样品 A：

   var myData = [
      {
        "date": "01/01/2017",
        "here-value": "20",
        "here-color": "pink",
        "there-value": "24",
        "there-color": "red",
      },
      {
        "date": "02/01/2017",
        "here-value": "80",
        "here-color": "blue",
        "there-value": "54",
        "there-color": "red",
      },
    ]

样品 B：

  var myData = [

    {
      "date": "01/01/2017",
      "here-value": "20",
      "here-color": "pink"
    },
    {
      "date": "01/01/2017",
      "there-value": "24",
      "there-color": "red"
    },

    {
      "date": "02/01/2017",
      "here-value": "80",
      "here-color": "blue"
    },
    {
      "date": "02/01/2017",
      "there-value": "54",
      "there-color": "red"
    }

]

我寻求重组数据的原因是创建将使用 D3 输入可视化的对象。结果将类似于：http://jsfiddle.net/vw88/nzwLg96a/

【问题讨论】：

预期结构错误，在开发者窗口粘贴试试，会报错
如果没有更多上下文，就不可能说哪个是最佳选择。这取决于您将如何使用这些数据。
感谢您的回复。我刚刚更新了问题以更正 JSON 并提供上下文。 JSON 文件的应用程序可以在 JS Fiddle 中看到。
如果数组中所有对象的键都相同，则没有什么能阻止您将其映射到新对象。顺便说一句，您使用的是原生 jQuery 对象……而不是 JSON。

标签： javascript json data-structures

【解决方案1】：

我想我也会使用 Array.reduce() 来包含这种方法

let restructuredData = myData.reduce((a, b) => {
    return a.concat([
        { "date": b["date"], "here-value": b["here-value"],  "here-color": b["here-color"] },
        { "date": b["date"], "there-value": b["there-value"],  "there-color": b["there-color"] }
    ]);
}, []);

【讨论】：

喜欢这个解决方案，它非常简洁易读:) +1

【解决方案2】：

这应该可以解决问题：

var sampleA = [
    {
    "date": "01/01/2017",
    "here-value": "20",
    "here-color": "pink",
    "there-value": "24",
    "there-color": "red",
    },
    {
    "date": "02/01/2017",
    "here-value": "80",
    "here-color": "blue",
    "there-value": "54",
    "there-color": "red",
    },
]


var sampleB = [];
sampleA.forEach( i => {
    let a = {};
    a.date = i.date;
    a['here-value'] = i['here-value'];
    a['here-color'] = i['here-color'];
    let b = {};
    b.date = i.date;
    b['there-value'] = i['there-value'];
    b['there-color'] = i['there-color'];
    sampleB.push(a, b);
});
console.log(sampleB);

【讨论】：

【解决方案3】：

这也有效，

var myData = [
      {
        "date": "01/01/2017",
        "here-value": "20",
        "here-color": "pink",
        "there-value": "24",
        "there-color": "red",
      },
      {
        "date": "02/01/2017",
        "here-value": "80",
        "here-color": "blue",
        "there-value": "54",
        "there-color": "red",
      },
    ] ;

  var newAr = [];

  myData.forEach(function(val, key){
    newAr.push({"date": val.date, "here-value": val["here-value"],
        "here-color": val["here-color"]});
    newAr.push({"date": val.date, "there-value": val["there-value"],
        "there-color": val["there-color"]});
  })

  console.log("newAr:", newAr);

【讨论】：

【解决方案4】：

var myData = [{
    "date": "01/01/2017",
    "here-value": "20",
    "here-color": "pink",
    "there-value": "24",
    "there-color": "red",
  },
  {
    "date": "02/01/2017",
    "here-value": "80",
    "here-color": "blue",
    "there-value": "54",
    "there-color": "red",
  },
]

var newData = []
myData.forEach(b => {

  newData.push({
    date: b.date,
    "here-value": b["here-value"],
    "here-color": b["here-color"],
  }, {
    date: b.date,
    "there-value": b["there-value"],
    "there-color": b["there-color"],
  })

});
console.log(newData);

【讨论】：