javascript – 如何在java脚本对象ES5中进行分组和合并

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript – 如何在java脚本对象ES5中进行分组和合并，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3751字，纯文字阅读大概需要6分钟。

内容图文

我有一个像这样的对象

{
"User 1":[
{"count":"1","stage":"A","jCount":"10","name":"User 1","stageId":"A1"},
{"count":"8","stage":"B","jCount":"10","name":"User 1","stageId":"B1"},
],

"User 2":[
{"count":"7","stage":"C","jCount":"8","name":"User 2","stageId":"C1"},
{"count":"8","stage":"B","jCount":"8","name":"User 2","stageId":"B1"},
{"count":"9","stage":"A","jCount":"8","name":"User 2","stageId":"A1"},
{"count":"8","stage":"D","jCount":"8","name":"User 2","stageId":"D1"},
],

"User 3":[
{"count":"6","stage":"D","jCount":"6","name":"User 3","stageId":"D1"},
{"count":"8","stage":"B","jCount":"6","name":"User 3","stageId":"B1"},
{"count":"1","stage":"A","jCount":"6","name":"User 3","stageId":"A1"},
],
/* Many more users */
}

我想以这种格式改变我的对象

[
{
"name":"User 1",
"jCount":10,
"stageIdCountA1":1,
"stageIdCountB1":8,
"stageIdCountC1":0,
"stageIdCountD1":0,
},{
"name":"User 2",
"jCount":8,
"stageIdCountA1":9,
"stageIdCountB1":8,
"stageIdCountC1":7,
"stageIdCountD1":8,
},{
"name":"User 3",
"jCount":6,
"stageIdCountA1":1,
"stageIdCountB1":8,
"stageIdCountC1":0,
"stageIdCountD1":6,
},
/* Many more users */
]

最多只有4个阶段A1,B1,C1,D1和jCount在子对象的用户数组中很常见

如果没有阶段,则应打印0

我试图在angularjs视图中进行操作,但它变得困难.

解决方法:

使用ES6和Object.entries可以执行以下操作：

const obj = {
  'User 1': [
{ count: '1', stage: 'A', jCount: '10', name: 'User 1', stageId: 'A1' },
{ count: '8', stage: 'B', jCount: '10', name: 'User 1', stageId: 'B1' }
  ],

  'User 2': [
{ count: '7', stage: 'C', jCount: '8', name: 'User 2', stageId: 'C1' },
{ count: '8', stage: 'B', jCount: '8', name: 'User 2', stageId: 'B1' },
{ count: '9', stage: 'A', jCount: '8', name: 'User 2', stageId: 'A1' },
{ count: '8', stage: 'D', jCount: '8', name: 'User 2', stageId: 'D1' }
  ],

  'User 3': [
{ count: '6', stage: 'D', jCount: '6', name: 'User 3', stageId: 'D1' },
{ count: '8', stage: 'B', jCount: '6', name: 'User 3', stageId: 'B1' },
{ count: '1', stage: 'A', jCount: '6', name: 'User 3', stageId: 'A1' }
  ]
  /* Many more users */
};

const stages = ['A1', 'B1', 'C1', 'D1'];

const getCount = (stage, user) => {
  const stageItem = obj[user.name].find(s => s.stageId === stage);
  return stageItem ? stageItem.count : 0;
};

const r = Object.entries(obj)
  .map(([name, user]) => ({ name, jCount: user[0].jCount }))
  .map(user => {
const stagesCounts = stages
  .map(stage => ({
    [`stageIdCount${stage}`]: getCount(stage, user)
  }))
  .reduce((acc, stage) => ({ ...acc, ...stage }), {});
return { ...user, ...stagesCounts };
  });

console.log(r);

更新(ES5)

const obj = {
  'User 1': [
    { count: '1', stage: 'A', jCount: '10', name: 'User 1', stageId: 'A1' },
    { count: '8', stage: 'B', jCount: '10', name: 'User 1', stageId: 'B1' }
  ],

  'User 2': [
    { count: '7', stage: 'C', jCount: '8', name: 'User 2', stageId: 'C1' },
    { count: '8', stage: 'B', jCount: '8', name: 'User 2', stageId: 'B1' },
    { count: '9', stage: 'A', jCount: '8', name: 'User 2', stageId: 'A1' },
    { count: '8', stage: 'D', jCount: '8', name: 'User 2', stageId: 'D1' }
  ],

  'User 3': [
    { count: '6', stage: 'D', jCount: '6', name: 'User 3', stageId: 'D1' },
    { count: '8', stage: 'B', jCount: '6', name: 'User 3', stageId: 'B1' },
    { count: '1', stage: 'A', jCount: '6', name: 'User 3', stageId: 'A1' }
  ]
  /* Many more users */
};

const stages = ['A1', 'B1', 'C1', 'D1'];

function getCount(stage, user) {
  const stageItem = obj[user.name].find(s => s.stageId === stage);
  return stageItem ? stageItem.count : 0;
}

function mapStages(user) {
  return stages
    .map(stage => ({
      [`stageIdCount${stage}`]: getCount(stage, user)
    }))
    .reduce((acc, stage) => ({ ...acc, ...stage }), {});
}

const r = Object.entries(obj)
  .map(function(entry) {
    return { name: entry[0], jCount: entry[1][0].jCount };
  })
  .map(function(user) {
    return Object.assign(user, mapStages(user));
  });

console.log(r);

内容总结

以上是互联网集市为您收集整理的javascript – 如何在java脚本对象ES5中进行分组和合并全部内容，希望文章能够帮你解决javascript – 如何在java脚本对象ES5中进行分组和合并所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端