本文介绍一种高效的数据分组方法：遍历原始对象数组，按指定字段（如 category）聚合同类项，并为每个唯一分类生成一个主对象，其 variants 字段包含所有匹配对象组成的数组（若仅一项则设为 null）。
本文介绍一种高效的数据分组方法：遍历原始对象数组，按指定字段（如 category）聚合同类项，并为每个唯一分类生成一个主对象，其 `variants` 字段包含所有匹配对象组成的数组（若仅一项则设为 `null``。
在实际开发中，我们常需对扁平数据进行逻辑聚合——例如商品列表中按品类归类，将重复品类的所有条目作为“变体”挂载到首个出现的代表项上。核心目标是：保留每个唯一分类的首条记录作为主项，同时将其全部同分类对象（含自身）收集至 variants 数组；若该分类仅出现一次，则 variants 为 null。
实现该逻辑推荐使用两阶段处理：
- 分组聚合（reduce）：以目标字段（如 category）为键，构建哈希映射，值为对应对象数组；
- 结构转换（Object.keys().map()）：遍历分组结果，为每个键生成标准化输出对象，提取首项的 position 和 category，并根据数组长度决定 variants 值。
以下是完整、健壮的实现代码（已优化可读性与边界兼容性）：
const products = [
{ position: 1, category: "jeans" },
{ position: 2, category: "tees" },
{ position: 3, category: "dress" },
{ position: 4, category: "dress" },
{ position: 5, category: "dress" },
];
// 阶段一：按 category 分组
const grouped = products.reduce((acc, product) => {
const { category } = product;
if (!acc[category]) acc[category] = [];
acc[category].push(product);
return acc;
}, {});
// 阶段二：构造最终结果数组
const result = Object.keys(grouped).map(key => {
const items = grouped[key];
return {
position: items[0].position,
category: key,
variants: items.length > 1 ? items : null
};
});
console.log(result);
// 输出符合预期的嵌套结构
✅ 关键注意事项：
- 此方案假设 category 是唯一分组依据；如需多字段联合去重（如 category + brand），可将键改为 ${category}-${brand} 字符串；
- position 取首项值仅为示例逻辑，若业务要求取最小/最大 position，可替换为 Math.min(...items.map(p => p.position))；
- 若原始数组为空，Object.keys(grouped).map(...) 会安全返回空数组，无需额外判空；
- variants: null 的设计便于后续模板渲染（如 Vue/React 中用 v-if="item.variants" 控制变体区块显示）。
该模式兼具性能（单次遍历 + 哈希查找 O(n)）与可维护性，适用于商品管理、内容聚合、配置分组等多种场景。
