JavaScript按国家分组数组：无序初始数组的重组实现方案

需求说明 #

我们有一组包含「国家、城市、日期」的二维数组，不管初始顺序是否混乱，需要将其按国家分组，把同一个国家的城市+日期数据归集到对应国家的条目下。

原始输入示例（顺序混乱） #

const originalArray = [
  ["Spain", "Madrid", "10-12-2024"],
  ["Suisse", "Berne", "10-18-2024"],
  ["France", "Paris", "10-22-2024"],
  ["France", "Lyon", "10-24-2024"],
  ["Spain", "Barcelona", "10-15-2024"]
];

期望输出格式 #

[
  ["Spain", 
    ["Madrid", "10-12-2024"], 
    ["Barcelona", "10-15-2024"]
  ],
  ["Suisse", 
    ["Berne", "10-18-2024"]
  ],
  ["France", 
    ["Paris", "10-22-2024"],
    ["Lyon", "10-24-2024"]
  ]
]

便捷实现方法 #

用JavaScript的reduce方法可以高效完成分组，无需关心原始数组顺序，代码逻辑清晰：

const groupedArray = Object.values(originalArray.reduce((acc, [country, city, date]) => {
  // 若当前国家未在累加器中，初始化条目
  if (!acc[country]) {
    acc[country] = [country];
  }
  // 将城市+日期追加到对应国家的条目下
  acc[country].push([city, date]);
  return acc;
}, {}));

console.log(groupedArray);

逻辑拆解 #

1. 遍历处理每一项：通过reduce逐个遍历原始数组元素，解构出国家、城市、日期三个值。
2. 用对象做临时存储：以国家名为键，分组后的数组为值，方便快速查找是否已有该国家的分组。
3. 归集对应数据：如果是第一次遇到某个国家，就创建以国家名为首元素的数组；之后每次遇到同国家的数据，就把城市+日期的子数组追加进去。
4. 转换为目标格式：用Object.values()把临时对象里的分组数组提取出来，得到最终需要的二维数组结构。

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