通过使用对象源数组按特定顺序对属性进行分组来形成数组

Question

我有一个具有以下结构的对象数组，将其作为响应发送：

    let sampleData = [
      { values: { High: 4, Low: 5,  Medium: 7 } , time: "1571372233234" , sum: 16 },
      { values: { High: 5, Low: 3, Medium : 1 }, time: "1571372233234" , sum: 9},
      { time: "14354545454", sum: 0},
      { time: "14354545454", sum: 0} }
    ];

我需要获取数组内每个对象内的每个键，并从中形成一个数组。基本上基于所有对象中存在的键进行分组。如果对象没有“值”，则应在val1，val2，val3中返回0。

但是问题是，问题中“值”对象内的键“高，低，中”的顺序是无法预测的。无论我写了什么代码，第一个对象中存在的键都将被分组并遵循该顺序。但是我希望它是任何输入顺序，它应该始终给我该顺序“高中低”顺序。

对象的结果数组应看起来像并且应始终遵循“高中阶”：

result = [
  { name: 'High', data: [4, 5, 0, 0] }, 
  { name: 'Medium', data: [5, 3, 0, 0] }, 
  { name: 'Low', data: [7, 1, 0, 0] }
]

我尝试了以下操作：

let sampleData = [{ values: { High: 4, Low: 5,  Medium: 7 } , time: "1571372233234" , sum: 16 },{ values: { High: 5, Low: 3, Medium : 1 }, time: "1571372233234" , sum: 9},{ time: "14354545454", sum: 0},{ time: "14354545454", sum: 0 }];
    
const keySet = new Set(sampleData.flatMap(a => Object.keys(a.values || {})));

const merged = sampleData.reduce((acc, {
  values = {}
}) => {
  keySet.forEach(name => {
    acc[name] = acc[name] || {
      name,
      data: []
    };
    acc[name].data.push(values[name] || 0);
  });
  return acc;
}, {});

console.log(merged);

Answer 1

let sampleData = [{ values: { High: 4, Low: 5,  Medium: 7 }, time: "1571372233234", sum: 16 }, { values: { High: 5, Low: 3, Medium : 1 }, time: "1571372233234", sum: 9 }, { time: "14354545454", sum: 0 }, { time: "14354545454", sum: 0 }],
    keys = ['High', 'Low', 'Medium'],
    grouped = sampleData.reduce((r, { values = {} } = {}) => {
        r.forEach(({ name, data }) => data.push(values[name] || 0));
        return r;
    }, keys.map(name => ({ name, data: [] })));

console.log(grouped);

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

Answer 2

sampleData.reduce((a, {values: {High = 0, Low = 0, Medium = 0} = {}})
                                                               ^
                                                               |
                                                               +-- When attr "values" is 
                                                                   undefined initialize
                                                                   as an "empty" object.

let sampleData = [{ values: { High: 4, Low: 5,  Medium: 7 } , time: "1571372233234" , sum: 16 },{ values: { High: 5, Low: 3, Medium : 1 }, time: "1571372233234" , sum: 9},{ time: "14354545454", sum: 0},{ time: "14354545454", sum: 0}];
    
let result = Object.values(sampleData.reduce((a, {values: {High = 0, Low = 0, Medium = 0} = {}}) => {
  (a["High"] || (a["High"] = {name: "High", data: []})).data.push(High);
  (a["Low"] || (a["Low"] = {name: "Low", data: []})).data.push(Low);
  (a["Medium"] || (a["Medium"] = {name: "Medium", data: []})).data.push(Medium);

  return a;
}, Object.create(null)));
    
 console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

您可以像这样构造最终的merged对象>>

mergedFinal = [ merged['High'], merged['Medium'], merged['Low'] ]