将数组对象展平为单个对象 - Javascript

Question

我正在使用 ChartKick 来表示多系列折线图中图表中的一些数据。要求的格式是：

let data = [
   { name: 'sharry', data: { '2008-08-02': 10006097, '2018-08-03': 10670, etc }},
   { name: 'stuart', data: { '2018-08-01' :1401231321, '2018-08-04': 2500000000, etc }}
];

我从数据库中得到的数据是：

let user_usage = [
  { "name":"stuart", "data": { "2018-08-02":10006097 } },
  { "name":"stuart", "data": { "2018-08-03":10670 } },
  { "name":"stuart", "data": { "2018-08-05":5800000 } },
  { "name":"stuart", "data": { "2018-08-07":10789000 } },
  { "name":"stuart", "data": { "2018-08-08":1033000000 } },
  { "name":"sharry", "data": { "2018-08-01":1401231321 } },
  { "name":"sharry", "data": { "2018-08-04":2500000000 } }
];

我已经尝试了 2 天以将数据库响应转换为上述所需的格式非常感谢大家的帮助。这是我到目前为止所拥有的。我正在使用 Ramda，但 ES6 可以使用：

let chartdata = [];
let u = R.groupBy(R.prop('name'))(user_usage);

Object.keys(u).forEach((name, index) => {
  chartdata.push({ name , data: {} });
  let usage = u[name];

  Object.keys(usage).forEach(row => {
    let data = usage[row].data;
    let date = Object.keys(data)[0];
    let total = data[Object.keys(data)[0]];
    chartdata[index].data = Object.assign({}, {`${date}: ${total}`};
  });
});

Answer 1

将 Array.reduce() 与 Object.assign() 结合使用，以便您可以将 data 对象分配给累加器的现有项目。

let user_usage = [
  { "name":"stuart", "data": { "2018-08-02":10006097 } },
  { "name":"stuart", "data": { "2018-08-03":10670 } },
  { "name":"stuart", "data": { "2018-08-05":5800000 } },
  { "name":"stuart", "data": { "2018-08-07":10789000 } },
  { "name":"stuart", "data": { "2018-08-08":1033000000 } },
  { "name":"sharry", "data": { "2018-08-01":1401231321 } },
  { "name":"sharry", "data": { "2018-08-04":2500000000 } }
];
var res = user_usage.reduce((acc, item) => {
  var existItem = acc.find(({name}) => name === item.name);
  if(existItem){
    Object.assign(existItem.data,item.data);
  } else {
    acc.push(item);
  }
  return acc;
}, 
[]);
console.log(res);

Answer 2

你可以这样做：

let user_usage = [
  { "name":"stuart", "data": { "2018-08-02":10006097 } },
  { "name":"stuart", "data": { "2018-08-03":10670 } },
  { "name":"stuart", "data": { "2018-08-05":5800000 } },
  { "name":"stuart", "data": { "2018-08-07":10789000 } },
  { "name":"stuart", "data": { "2018-08-08":1033000000 } },
  { "name":"sharry", "data": { "2018-08-01":1401231321 } },
  { "name":"sharry", "data": { "2018-08-04":2500000000 } }
];

let data = user_usage.reduce((a, c) => {
  let key = Object.keys(c.data)[0];
  let found = a.find(v => v.name === c.name);
  if(found){
    found.data[key] = c.data[key];
  }else{
    a.push(c);
  }
  return a;
}, [])

console.log(data);

Answer 3

var obj = {};
user_usage.forEach(function(e){
    if(!obj[e.name]){
       obj[e.name] = e.data;
    } else {
       obj[e.name] = Object.assign(obj[e.name], e.data)
    }
});
var array = Object.keys(obj).map(function(e){return {name: e, data: obj[e]}})

Answer 4

您可以使用 Object.assign() 和 Map() 以获得更有效的解决方案：

let user_usage = [ { "name":"stuart", "data": { "2018-08-02":10006097 } }, { "name":"stuart", "data": { "2018-08-03":10670 } }, { "name":"stuart", "data": { "2018-08-05":5800000 } }, { "name":"stuart", "data": { "2018-08-07":10789000 } }, { "name":"stuart", "data": { "2018-08-08":1033000000 } }, { "name":"sharry", "data": { "2018-08-01":1401231321 } }, { "name":"sharry", "data": { "2018-08-04":2500000000 } } ];
var map = new Map();
user_usage.forEach((obj)=>{
  if(map.has(obj.name)){
    var mapObject = map.get(obj.name);
    Object.assign(mapObject.data, obj.data);
    map.set(obj.name ,mapObject); 
  } else{
    map.set(obj.name, Object.assign({},obj));
  }
});
let result = Array.from(map.values());

console.log(result);

Answer 5

这里也有一个ramda的例子供参考：

pipe(
  groupBy(prop('name')),
  map(pipe(pluck('data'), mergeAll)),
)

将数组对象展平为单个对象 - Javascript

Flatten an array object to single object - Javascript

javascript

arrays

object

ecmascript-6

ramda.js