JavaScript中如何按首个元素合并数组并分组

原始数据 #

const rawData = [
  ['Brand', 'Workout', 12],
  ['Colour', 'Pink', 41],
  ['Fit', 'Regular', 238],
  ['Size', '10', 21],
  ['Type', 'T-Shirt', 139],
  ['Colour', 'Black', 71],
  ['Brand', 'Matalan', 13]
];

实现方法（推荐用reduce） #

const groupedResult = rawData.reduce((acc, [category, key, value]) => {
  if (!acc[category]) {
    acc[category] = {};
  }
  acc[category][key] = value;
  return acc;
}, {});

// 输出结果即为目标结构
console.log(groupedResult);

逻辑说明 #

• 用数组reduce方法遍历数据，初始累加器设为空对象
• 解构每个子数组，直接提取分类名、键、值
• 若当前分类在累加器中不存在，先初始化一个空对象
• 将键值对存入对应分类的对象中，最终得到分组结果

传统for循环实现（适合新手理解） #

const groupedResult = {};

for (const item of rawData) {
  const category = item[0];
  const key = item[1];
  const value = item[2];
  
  if (!groupedResult[category]) {
    groupedResult[category] = {};
  }
  groupedResult[category][key] = value;
}

console.log(groupedResult);

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