JavaScript如何基于多键将一维数组拆分为指定格式的二维数组

我有如下所示的一维数组，数组内单个对象的结构如下：

[
  {
    date: "01/01/2020",
    type1: 264,
    type2: 1937,
    type3: 30
  },
  ...
]

我需要将上述数组转换为如下格式的二维数组：

[
  [
    {
      "date": "01/01/2020",
      "type": "type1",
      "value": 264
    },
    {
      "date": "01/01/2020",
      "type": "type2",
      "value": 1937
    }
    .....
  ],
  [
    {
      "date": "01/01/2020",
      "type": "type3",
      "value": 30
    }
    .....
  ]
]

具体规则为第一个子数组存放type1、type2对应的条目，第二个子数组存放type3对应的条目。
我是JavaScript新手，目前使用原生JavaScript的实现代码如下：

const type1 = data.map((e: any) => ({
  date: e.date,
  type: "type1",
  value: e.type1
}));

const type2 = data.map((e: any) => ({
  date: e.date,
  type: "type2",
  value: e.type2
}));

const type3 = data.map((e: any) => ({
  date: e.date,
  type: "type3",
  value: e.type3
}));

const newData = [type1.concat(type2), type3];

请问是否有更优的实现方式？

你的现有实现逻辑正确，可读性也很好，唯一的不足是对原数组总共进行了3次遍历，当数据量级较大时会有不必要的性能开销。可以优化为只遍历一次原数组完成全部转换，性能更好：

const result = [[], []]
for (const item of data) {
  // 向第一个子数组插入type1、type2的条目
  result[0].push(
    { date: item.date, type: 'type1', value: item.type1 },
    { date: item.date, type: 'type2', value: item.type2 }
  )
  // 向第二个子数组插入type3的条目
  result[1].push({ date: item.date, type: 'type3', value: item.type3 })
}

如果后续可能调整分组规则，比如新增类型、调整类型所属分组，可以提前定义分组配置，扩展性更强：

// 配置分组规则：数组下标对应结果子数组的位置，元素为该分组包含的类型字段
const groupConfig = [['type1', 'type2'], ['type3']]
const result = groupConfig.map(() => [])

for (const item of data) {
  groupConfig.forEach((typeList, groupIndex) => {
    typeList.forEach(type => {
      result[groupIndex].push({
        date: item.date,
        type,
        value: item[type]
      })
    })
  })
}

这个写法不需要修改遍历逻辑，只需要调整groupConfig就能适配新的分组规则。

内容的提问来源于stack exchange，提问作者lazyCoder