JavaScript如何按对象键下划线后的值对值数组分组

实现思路 #

整个逻辑没有复杂操作，核心就是三步：

1. 遍历输入对象的所有条目，拆分每个键拿到下划线后的数字作为分组ID
2. 把同分组下的原数组值全部合并到对应分组的数组里
3. 如果要匹配题目给出的去重预期，在合并时用Set去掉重复元素

代码实现 #

基础合并版本（保留重复元素） #

适合同组元素不需要去重的场景：

const inputObj = {"1_1":[1,2],"2_1":[2,1,3],"3_2":[4,5],"4_2":[6,7]};
const result = {};

for (const [key, valList] of Object.entries(inputObj)) {
  // 拆分键：按下划线分割，取后半段转为数字作为分组键
  const groupKey = Number(key.split('_')[1]);
  // 分组不存在则初始化空数组
  if (!result[groupKey]) result[groupKey] = [];
  // 展开当前值数组，追加到分组下
  result[groupKey].push(...valList);
}
// 输出结果：{ 1: [1,2,2,1,3], 2: [4,5,6,7] }

匹配题目预期的去重版本 #

合并时自动去掉组内重复元素，最终输出和题目给出的预期完全一致：

const inputObj = {"1_1":[1,2],"2_1":[2,1,3],"3_2":[4,5],"4_2":[6,7]};
const result = {};

for (const [key, valList] of Object.entries(inputObj)) {
  const groupKey = Number(key.split('_')[1]);
  // 合并原有分组值和新值，通过Set去重后转回数组
  result[groupKey] = Array.from(new Set([...(result[groupKey] || []), ...valList]));
}
// 输出结果：{ 1: [1,2,3], 2: [4,5,6,7] }

精简reduce写法 #

如果偏好链式写法，可以用Object.entries结合reduce实现同等逻辑：

const result = Object.entries(inputObj).reduce((acc, [key, valList]) => {
  const groupKey = Number(key.split('_')[1]);
  acc[groupKey] = Array.from(new Set([...(acc[groupKey] || []), ...valList]));
  return acc;
}, {});

注意：题目中写的类数组结构[1: [...], 2: [...]]是对键值映射的简化描述，JavaScript中合法的键值存储是普通对象形式，不存在语法层面的数组数字键写法，上述代码输出的对象结构和预期的映射关系完全等价。

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