javascript - 基于分组使用源对象数组的属性创建对象数组

标签 javascript arrays ecmascript-6

我有一个具有以下结构的对象数组:


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


我需要获取数组中每个对象中的每个键并从中形成一个数组。基本上根据所有对象中存在的键进行分组。如果对象没有“值”,它应该在 val1、val2、val3 帮助中返回 0,我们将不胜感激。

生成的对象数组应如下所示:

result = [
  { name: 'val1', data: [4, 5, 0, 0] }, 
  { name: 'val2', data: [5, 3, 0, 0] }, 
  { name: 'val3', data: [7, 1, 0, 0] }
]

到目前为止我已经尝试过:

var result = sampleData.map(value => ({ value: value.values }));

最佳答案

你可以 reduce阵列。创建一个累加器,每个 valx 作为键,{ name: valx, data: [] } 作为它的值。遍历每个 values 的键并更新累加器。然后使用 Object.values()获取合并对象的值以获得所需的输出

const sampleData = [
   { values: { val1: 4, val2: 5, val3: 7 } },
   { values: { val1: 5, val2: 3, val3: 1 }},
   { values: { val1: 4, val2: 7, val3: 2 } },
   { values: { val1: 5, val2: 1, val3: 5 } }
];

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

const output = Object.values(merged)

console.log(output)

更新:

如果 values 是可选的,您可以检查 values 是否未定义。但是,如果您在 values 不存在时需要 0,则需要另一个步骤。首先,我们需要获取数组中所有可用的 valx 键。因为,如果 { time: "14354545454", sum: 0} 出现在数组的开头,则无法知道数组中存在哪些可能的键。您可以使用 flatMap 执行此操作和 Set .然后遍历每个对象的键集。如果 values 不存在,则为正在循环的当前 valx 键添加一个默认的 0

let sampleData = [
   { values: { val1: 4, val2: 5, val3: 7 } , time: "1571372233234" , sum: 16 },
   { values: { val1: 5, val2: 3, val3: 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(Object.values(merged))

关于javascript - 基于分组使用源对象数组的属性创建对象数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58501667/

相关文章:

javascript - YYYY-MM-DDTHH格式的js中的相对时间函数:MM:SS+0000

javascript - 在两个属性上连接两个对象数组的更好方法?

javascript - Chrome 错误 : "Require user gesture for beforeunload dialogs" during Cypress tests 有解决方法吗

javascript - 测试数组是否是多维的

validation - Vuetify 表单验证——定义匹配输入的 ES6 规则

javascript - 使用过滤器返回 Promise.all 的 promise 数组不起作用

javascript - es6 箭头函数调试器语句

javascript - 更改数组而不链接引用

c - MIPS 程序集 - 数组?

javascript - 在 ES6 中创建 HTML/JS "plugin"- 如何刷新 DOM 节点