JS合并数组对象中key值相同的数据

# 将数组里某个属性相同的对象合并到一个数组中

原数组示例：

  let oldData = [
    {
      type:"篮球",
      value:20
    },
    {
      type:"跑步",
      value:40
    },
    {
      type:"游泳",
      value:10
    }
    {
      type:"跑步",
      value:15
    }
  ]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

希望获得的数据格式（即将相同”type“值的对象合并为一个新的数组）

let resultData = [
  {
    type: "篮球",
    infoList: [
      {
        type: "篮球",
        value: 20,
      },
    ],
  },
  {
    type: "跑步",
    infoList: [
      {
        type: "跑步",
        value: 40,
      },
      {
        type: "跑步",
        value: 15,
      },
    ],
  },
  {
    type: "游泳",
    infoList: [
      {
        type: "游泳",
        value: 10,
      },
    ],
  },
];

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

# 实现方案

# 方法一

let tempArr = [];
let data = [];
for (let i = 0; i < oldData.length; i++) {
  if (tempArr.indexOf(oldData[i].type) === -1) {
    data.push({
      type: oldData[i].type,
      infoList: [oldData[i]],
    });
    tempArr.push(oldData[i].type);
  } else {
    for (let j = 0; j < data.length; j++) {
      if (data[j].type == oldData[i].type) {
        data[j].infoList.push(oldData[i]);
        break;
      }
    }
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

# 方法二

let infoList = {};
oldData.forEach((item, index) => {
  let { type } = item;
  if (!infoList[type]) {
    infoList[type] = {
      type,
      list: [],
    };
  }
  infoList[type].list.push(item);
});

let list = Object.values(infoList); // 转换后的数据

1
2
3
4
5
6
7
8
9
10
11
12
13

#JavaScript

上次更新: 2022/09/06, 10:30:04

← JS声明提升数组对象求和→