从键值对创建对象数组

Question

我从一个服务中收到了一个JSON对象，其中包含键值对，我需要根据其中一列动态地创建对象进行分组。

JSON的格式如下：

[
    { "Group" : "A", "Key" : "Name", "Value" : "John" },
    { "Group" : "A", "Key" : "Age",  "Value" : "30" },
    { "Group" : "A", "Key" : "City", "Value" : "London" },
    { "Group" : "B", "Key" : "Name", "Value" : "Hans" },
    { "Group" : "B", "Key" : "Age",  "Value" : "35" },
    { "Group" : "B", "Key" : "City", "Value" : "Berlin" },
    { "Group" : "C", "Key" : "Name", "Value" : "José" },
    { "Group" : "C", "Key" : "Age",  "Value" : "25" },
    { "Group" : "C", "Key" : "City", "Value" : "Madrid" }
]

我需要将它转换为以下对象数组：

[
    { Group : "A", Name : "John", Age : 30, City : "London" },
    { Group : "B", Name : "Hans", Age : 35, City : "Berlin" },
    { Group : "C", Name : "José", Age : 25, City : "Madrid" }
]

每个组可以包含任意数量的键值对。

目前我有一个可行的解决方案，但我不知道它是否最优。

var items = [
    { "Group" : "A", "Key" : "Name", "Value" : "John" },
    { "Group" : "A", "Key" : "Age",  "Value" : "30" },
    { "Group" : "A", "Key" : "City", "Value" : "London" },
    { "Group" : "B", "Key" : "Name", "Value" : "Hans" },
    { "Group" : "B", "Key" : "Age",  "Value" : "35" },
    { "Group" : "B", "Key" : "City", "Value" : "Berlin" },
    { "Group" : "C", "Key" : "Name", "Value" : "José" },
    { "Group" : "C", "Key" : "Age",  "Value" : "25" },
    { "Group" : "C", "Key" : "City", "Value" : "Madrid" }
], item, record, hash = {}, results = [];

// Create a "hash" object to build up
for (var i = 0, len = items.length; i < len; i += 1) {
    item = items[i];

  if (!hash[item.Group]) {
    hash[item.Group] = {
      Group : item.Group
    };
  }
  hash[item.Group][item.Key] = item.Value;
}

// Push each item in the hash to the array
for (record in hash) {
  if(hash.hasOwnProperty(record)) {
    results.push(hash[record]);
  }
}

您可以在此处检查代码片段：http://jsbin.com/ozizom/1/ 您有更好的解决方案吗？

- tpolyak

---

你的JSON数据在Group字段上始终有序吗？ - sp00m

是的，给定了JSON字段组、键和值，并且记录将始终按组排序。 - tpolyak

Answer 1

假设JSON记录始终按组排序，这里提供另一种方法：

假设 JSON 记录始终按组排序，这里提供另一种方法：

var json = [
    { "Group" : "A", "Key" : "Name", "Value" : "John" },
    { "Group" : "A", "Key" : "Age",  "Value" : "30" },
    { "Group" : "A", "Key" : "City", "Value" : "London" },
    { "Group" : "B", "Key" : "Name", "Value" : "Hans" },
    { "Group" : "B", "Key" : "Age",  "Value" : "35" },
    { "Group" : "B", "Key" : "City", "Value" : "Berlin" },
    { "Group" : "C", "Key" : "Name", "Value" : "José" },
    { "Group" : "C", "Key" : "Age",  "Value" : "25" },
    { "Group" : "C", "Key" : "City", "Value" : "Madrid" }
];

var array = [];
var previousGroup = null;

for(var i=0; i<json.length; i++) {
    var group = json[i].Group;
    if(previousGroup != group) {
        array.push({Group: group});
        previousGroup = group;
    }
    array[array.length-1][json[i].Key] = json[i].Value;
}

这里 是一个可工作的例子。

- sp00m

---

发现一个问题。你的解决方案只在组按顺序到达（AAABBBCCC）时才能正确工作。例如，如果顺序是AAABBCCCB，则会创建4个记录：http://jsfiddle.net/GrmZF/2/ - tpolyak

@tpolyak 是的，我知道，这就是为什么我问你记录是否总是按组排序的原因... - sp00m

Answer 2

这里有一个解决方案，通过使用JavaScript习惯用语来减少代码大小（无论好坏如何）。该解决方案不依赖于输入值的顺序：

var values = [
  {Group: 'A', Key: 'Name', Value: 'John'},
  {Group: 'A', Key: 'Age', Value: '30'},
  {Group: 'A', Key: 'City', Value: 'London'},
  {Group: 'B', Key: 'Name', Value: 'Hans'},
  {Group: 'B', Key: 'Age', Value: '35'},
  {Group: 'B', Key: 'City', Value: 'Berlin'},
  {Group: 'C', Key: 'Name', Value: 'José'},
  {Group: 'C', Key: 'Age', Value: '25'},
  {Group: 'C', Key: 'City', Value: 'Madrid'}
];

var map = {};
values.forEach(function(value) {
  map[value.Group] = map[value.Group] || {Group: value.Group};
  map[value.Group][value.Key] = value.Value;
});

var results = Object.keys(map).map(function(key) { return map[key]; });

一个可工作的示例在http://jsfiddle.net/arQww中。

以下是我能找到的最快速解决方案，假设值始终按组排序：

var group, results = [];
for (var i = 0; i < values.length; ) {
  results.push({Group: group = values[i].Group});
  do {
    results.push[results.length - 1][values[i].Key] = values[i].Value;  
  } while (++i < values.length && values[i].Group == group);
}

性能比较请看http://jsperf.com/vnmzc。虽然第二种解决方案更快，但两者的性能都是O(n)，实际应用中它们之间的差异微不足道，因此第一种解决方案可能更可取，因为它更简单、更通用。

- dharcourt

Answer 3

如果你需要频繁操作数据，我建议使用underscore框架。以下是在该框架中的解决方案：

/*
 We group items into object that looks like {group: attributes, ..}
 Then for each group we create result object denoting group,
 and extend result with object created from keys and values of attributes
*/
_.map(_.groupBy(items, function (item) {return item.Group}),
     function (attributes, group) {
        return _.extend({Group: group},
                        _.object(_.pluck(attributes, 'Key'),
                                 _.pluck(attributes, 'Value')))
    })

- Ivan Klass

Answer 4

我需要帮助解决一个类似的问题，但我想要对值进行求和。我有一个包含对象的数组。

var myArrWithObj = [
    {DateToSort: "Jul2014", ValueOneToSum: "60", ValueTwoToSum: "15"},
    {DateToSort: "Jul2014", ValueOneToSum: "30", ValueTwoToSum: "50"},
    {DateToSort: "Jul2014", ValueOneToSum: "12", ValueTwoToSum: "22"},
    {DateToSort: "Aug2014", ValueOneToSum: "65", ValueTwoToSum: "25"},
    {DateToSort: "Aug2014", ValueOneToSum: "13", ValueTwoToSum: "10"},
    {DateToSort: "Aug2014", ValueOneToSum: "90", ValueTwoToSum: "20"},
    {DateToSort: "Sep2014", ValueOneToSum: "60", ValueTwoToSum: "15"},
    {DateToSort: "Sep2014", ValueOneToSum: "60", ValueTwoToSum: "18"},
    {DateToSort: "Sep2014", ValueOneToSum: "75", ValueTwoToSum: "18"}
                   ];

我希望用户可以通过下拉菜单选择要从哪个月份开始累加。

所以，如果用户从选项菜单中选择了2014年8月，我想根据Aug2014来统计所有ValueOneToSum值和ValueTwoToSum值的总和，我该怎么做？

例如：对于Aug2014，totalSumOne将是168，而totalSumTwo将是55。

- user3771408