如何按国家标签分组数据并生成含12个月份索引的数组

现有如下JavaScript数组：

arr = [
  { label: 'US', data: '10', monthNumber: 1 },
  { label: 'US', data: '2', monthNumber: 3  },
  { label: 'US', data: '60', monthNumber: 2  },
  { label: 'UK', data: '10', monthNumber: 5 },
  { label: 'SA', data: '1', monthNumber: 1  },
  { label: 'CA', data: '70', monthNumber: 1  },
  { label: 'SA', data: '10', monthNumber: 12 },
];

需求：按label（国家）分组，为每个国家生成包含12个元素的data数组（对应1-12月），将原数据填充到对应monthNumber-1的索引位置，其余位置填0，最终得到目标结构的数组。

实现代码 #

const transformData = (arr) => {
  // 按国家分组并初始化数据结构
  const groupedData = arr.reduce((acc, item) => {
    const { label, data, monthNumber } = item;
    // 首次遇到该国家时，创建带全0数组的结构
    if (!acc[label]) {
      acc[label] = {
        label,
        data: Array(12).fill(0)
      };
    }
    // 将对应月份的数值填充到指定索引
    acc[label].data[monthNumber - 1] = Number(data);
    return acc;
  }, {});

  // 将分组对象转为数组返回
  return Object.values(groupedData);
};

// 调用示例
const result = transformData(arr);
console.log(result);

输出结果 #

执行后得到的目标结构如下：

[
  { label: 'US', data: [10, 60, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0] },
  { label: 'UK', data: [0, 0, 0, 0, 10, 0, 0, 0, 0, 0, 0, 0] },
  { label: 'SA', data: [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 10] },
  { label: 'CA', data: [70, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0] }
]

代码说明 #

• 用Array.reduce()完成分组逻辑，遍历原数组时自动初始化每个国家的基础结构（包含12个0的data数组）。
• 将原数据的字符串类型data转为数字，填充到对应月份的索引位置（数组索引从0开始，对应1-12月需减1）。
• 最后通过Object.values()将分组对象转换为数组格式，得到最终要求的结构。

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