
本文介绍使用 javascript 的 reduce 方法,根据指定字符串属性(如 category)对对象数组进行分组合并,将同组对象的其余属性扁平合并到同一对象中。
在实际开发中,我们常需将结构扁平、按类别分散的对象数组,聚合成以类别为单位的聚合对象数组。例如,原始数据中每个对象代表一个子项(如活动类型下的具体项目),而目标是将同一 category 下的所有键值对合并到单个对象中。
✅ 正确实现方式(推荐)
核心思路:利用 reduce 遍历数组,以 category 值为键,在累加器对象(acc)中动态创建或复用对应分组对象,并用 Object.assign 合并当前对象的所有属性:
const data = [
{ category: 'Entertainment', 'Hang with Friends': 100 },
{ category: 'Entertainment', Chill: 30 },
{ category: 'Health', Yoga: 40 },
{ category: 'Health', Birthday: 200 }
];
const grouped = Object.values(
data.reduce((acc, curr) => {
// 若 acc 中尚无该 category 对应的对象,则初始化为空对象
const target = (acc[curr.category] ??= {});
// 将 curr 的所有自有属性合并进 target
Object.assign(target, curr);
return acc;
}, {})
);
console.log(grouped);
// [
// { category: 'Entertainment', 'Hang with Friends': 100, Chill: 30 },
// { category: 'Health', Yoga: 40, Birthday: 200 }
// ]? 技巧说明:acc[curr.category] ??= {} 是空值合并赋值语法,等价于 acc[curr.category] = acc[curr.category] ?? {},安全且简洁。
✅ 更规范的数据结构(带 subCategory 和 price)
若原始数据采用标准化三字段结构(category / subCategory / price),则需动态以 subCategory 为键、price 为值注入,同时保留 category 字段:
const normalizedData = [
{ category: 'Entertainment', subCategory: 'Hang with Friends', price: 100 },
{ category: 'Entertainment', subCategory: 'Chill', price: 30 },
{ category: 'Health', subCategory: 'Yoga', price: 40 },
{ category: 'Health', subCategory: 'Birthday', price: 200 }
];
const result = Object.values(
normalizedData.reduce((acc, { category, subCategory, price }) => {
const group = (acc[category] ??= { category });
group[subCategory] = price;
return acc;
}, {})
);
console.log(result);
// [
// { category: 'Entertainment', 'Hang with Friends': 100, Chill: 30 },
// { category: 'Health', Yoga: 40, Birthday: 200 }
// ]⚠️ 注意事项
避免覆盖 category 字段:由于每次 Object.assign(target, curr) 会写入 curr.category,若多个同 category 对象的 category 值一致则无影响;但若存在不一致(如脏数据),建议显式保留初始值(如上例中 acc[category] ??= { category })。
DELPHI控件属性、方法、事件及常用函数 word文档 doc格式下载DELPHI控件属性、方法、事件及常用函数 一. TmainMemu控件 该控件是一个标准的菜单控件,运用它为窗口提供菜单。该对象的层次结构为:TObject—TPersistent--TCompoment—TMenu。 属性 1-AutoMetge:Boolean 功能:用于确定非MID程序中非主Form上的菜单要不要和主Form的菜单合并。主Form菜单AutoMerge的特性总是False。此外,还要设置菜单项的GroupIndex属性。 2-BiDiMode
键名冲突处理:若不同对象存在相同非-category 属性名(如都含 id),后出现的值将覆盖先出现的——这是 Object.assign 的默认行为,符合多数场景预期;如需深度合并或冲突策略,应改用 structuredClone + 自定义合并逻辑。
-
TypeScript 类型提示:为避免类型推断错误,建议显式标注 reduce 的累加器类型:
data.reduce
>>((acc, curr) => { /* ... */ }, {})
✅ 总结
按字符串属性(如 category)归并对象数组,本质是「分组 + 属性合并」问题。Array.prototype.reduce 搭配对象字面量作为哈希表(以 category 为 key),配合 Object.assign 或手动赋值,即可高效、可读地完成转换。无论原始数据是宽表形式还是标准化三元组,只需微调合并逻辑,即可统一解决。









