本文介绍如何使用 JavaScript 将原始数组中具有相同 title 和 sku 的对象聚合为新数组，把重复项的 size 字段合并为逗号分隔字符串。
本文介绍如何使用 javascript 将原始数组中具有相同 title 和 sku 的对象聚合为新数组，把重复项的 size 字段合并为逗号分隔字符串。
在电商或商品管理类应用中，常会遇到“同一款商品多个尺码分散为多条记录”的场景。例如，一双 Nike Dunk Low Panda 有 9 US、10 US、11 US 三种尺码，原始数据以三条独立对象形式存在；而展示或导出时，往往需要将其合并为一条，其中 size 字段为 '9 US, 10 US, 11 US'。这种「按关键字段分组 + 字段聚合」是前端数据处理的典型需求。
实现该逻辑最清晰、高效的方式是借助 Map 对象进行键值映射：以 title 和 sku 的组合为唯一键（如 'Nike Dunk Low Panda-DD1391-100'），值为聚合后的对象。遍历原始数组时，若键已存在，则追加尺寸；否则新建条目。
以下是完整可运行示例：
const originalData = [
{ title: 'Nike Dunk Low Panda', sku: 'DD1391-100', size: '9 US' },
{ title: 'Nike Dunk Low Panda', sku: 'DD1391-100', size: '10 US' },
{ title: 'Nike Dunk Low Panda', sku: 'DD1391-100', size: '11 US' },
{ title: 'Adidas Samba Classic', sku: 'GW7554', size: '8.5 US' },
{ title: 'Adidas Samba Classic', sku: 'GW7554', size: '9 US' },
];
const aggregatedMap = new Map();
originalData.forEach(item => {
const key = `${item.title}-${item.sku}`;
if (aggregatedMap.has(key)) {
// 已存在：追加尺寸，注意避免开头多余逗号
const existing = aggregatedMap.get(key);
existing.size += `, ${item.size}`;
} else {
// 首次出现：创建新对象并存入 Map
aggregatedMap.set(key, {
title: item.title,
sku: item.sku,
size: item.size
});
}
});
const result = Array.from(aggregatedMap.values());
console.log(result);
// 输出：
// [
// { title: 'Nike Dunk Low Panda', sku: 'DD1391-100', size: '9 US, 10 US, 11 US' },
// { title: 'Adidas Samba Classic', sku: 'GW7554', size: '8.5 US, 9 US' }
// ]
✅ 注意事项与优化建议：
-
键构造安全：若
title或sku可能含-或特殊字符，建议改用更健壮的键生成方式（如 JSON.stringify([item.title, item.sku])），避免冲突； -
空值防护：生产环境应增加
item.title && item.sku判空，防止undefined导致错误键； -
扩展性：如需聚合其他字段（如价格范围、库存总和），只需在
else分支初始化对应属性，并在if分支中累加即可； -
替代方案：也可用
reduce()实现，但Map在多次查找/更新场景下语义更清晰、性能更优（O(1) 查找）。
掌握此类数组聚合模式，不仅能解决尺寸合并问题，更是构建筛选器、分组统计、去重归并等通用数据处理能力的基础。
