javascript - 如何迭代对象数组并按键名对属性值进行分组？

Question

我有一个名为 data 的对象数组，如下所示:

data = [{"timeslot":"7pm-8pm","Monday":60,"Tuesday":55},
        {"timeslot":"8pm-9pm","Monday":70,"Tuesday":60},
        {"timeslot":"9pm-10pm","Monday":40,"Tuesday":37}]

我想从这个数组中得到三个新数组，像这样:

timeslot = ["7pm-8pm", "8pm-9pm", "9pm-10pm"]
monday   = [60, 70, 40]
tuesdat  = [55, 60, 37]

根据数据值所属的data 属性名称对数据值进行有效分组。

这是我的Javascript

var timeslot = [];
var monday = [];
var tuesday = [];

var result = {};

// Iterate the objects of the array
for(var i = 0, len = data.length; i < len; i++) {
    var obj = data[i];
    // Iterate the properties of the object
    Object.keys(obj).forEach(function(key) {
        // Push the value of each property to an array sharing the property's key name
        result[key.toLowerCase()] = [obj[key]];
    });
}

console.log(result.timeslot, result.monday, result.tuesday);

返回

["9pm-10pm"] [40] [37]

这些是data 的第三个也是最后一个对象的属性值。看起来 forEach 中的代码正在用当前元素替换新数组的前一个元素。每个新数组只包含一个元素，而不是所需的三个。

我该如何解决这个问题？

Answer 1

基本上你正在用一个新数组覆盖最后的结果

result[key.toLowerCase()] = [obj[key]];
// ^^^^^^^^^^^^^^^^^^^^^^   ^        ^

但是你只需要一个数组作为一个键并推送实际值，比如

result[key] = result[key] || []; // create array, if not exist
result[key].push(o[k]);          // push value

工作代码:

var data = [{ timeslot: "7pm-8pm", Monday: 60, Tuesday: 55 }, { timeslot: "8pm-9pm", Monday: 70, Tuesday: 60}, { timeslot: "9pm-10pm", Monday: 40, Tuesday: 37 }],
    result = {};

data.forEach(function (o) {
    Object.keys(o).forEach(function (k) {
        var key = k.toLowerCase();
        result[key] = result[key] || [];
        result[key].push(o[k]);
    });
});

console.log(result);