javascript - JS 对象数组 - 删除重复并合并嵌套对象
问题描述
仍在学习 JS,我一直在为这个问题苦苦挣扎,并在 Stack Overflow链接上找到了一个类似的解决方案,我试图在此之后对我的解决方案进行建模,但我似乎无法为我的用例弄清楚......所以会感谢有关如何修复我拥有的代码的建议,甚至只是在正确方向上的一些帮助
所以我试图从基于“objectID”的对象数组(见下文)中删除重复项,如果它们是唯一的,则将每个级别(lvl0,lvl1,lvl2)的嵌套“hierarchicalCategories”合并到一个数组中。
let objArray = [
{
"objectID": "1234",
"hierarchicalCategories": {
"lvl0": "Women's"
}
},
{
"objectID": "1234",
"hierarchicalCategories": {
"lvl0": "Women's",
"lvl1": "Women's > Jewelry",
"lvl2": "Women's > Jewelry > New"
}
},
{
"objectID": "1234",
"hierarchicalCategories": {
"lvl0": "New",
"lvl1": "New > Jewelry"
}
},
{
"objectID": "5678",
"hierarchicalCategories": {
"lvl0": "Men's",
"lvl1": "Men's > Shoes",
}
},
{
"objectID": "5678",
"hierarchicalCategories": {
"lvl0": "New",
"lvl1": "New > Shoes"
}
}
]
预期结果应如下所示:每个“objectID”的一个实例,然后如果每个级别都有唯一值,则合并“hierarchicalCategories”
let newArray = [
{
"objectID": "1234",
"hierarchicalCategories": {
"lvl0": ["Women's","New"],
"lvl1": ["Women's > Jewelry","New > Jewelry"],
"lvl2": ["Women's > Jewelry > New"]
}
},
{
"objectID": "5678",
"hierarchicalCategories": {
"lvl0": ["Men's", "New"],
"lvl1": ["Men's > Shoes","New > Shoes"]
}
}
]
这是我使用的代码,它在一定程度上有效,但不能完全有效。基本上在每个级别(lvl0,lvl1,lvl2),我正在创建一个数组,然后仅在之前未包含它的情况下推送。但是,如果没有定义的级别在"objectID": "5678"
其中"lvl2"
任何重复项中都没有定义,则该插槽中的过滤数组中将有一个空数组,但似乎无法在不完全破坏它的情况下修复它. 还可以接受其他建议 + 学习以改进代码或其他方法。
const filteredArr = objArray.reduce((acc, current) => {
const x = acc.find(item => item.objectID === current.objectID);
if (!x) {
current.hierarchicalCategories.lvl0 ? current.hierarchicalCategories.lvl0 = [current.hierarchicalCategories.lvl0] : current.hierarchicalCategories.lvl0 = []
current.hierarchicalCategories.lvl1 ? current.hierarchicalCategories.lvl1 = [current.hierarchicalCategories.lvl1] : current.hierarchicalCategories.lvl1 = []
current.hierarchicalCategories.lvl2 ? current.hierarchicalCategories.lvl2 = [current.hierarchicalCategories.lvl2] : current.hierarchicalCategories.lvl2 = []
acc.push(current)
} else {
if (current.hierarchicalCategories.lvl0 && !x.hierarchicalCategories.lvl0.includes(current.hierarchicalCategories.lvl0)) {
x.hierarchicalCategories.lvl0.push(current.hierarchicalCategories.lvl0)
}
if (current.hierarchicalCategories.lvl1 && !x.hierarchicalCategories.lvl1.includes(current.hierarchicalCategories.lvl1)) {
x.hierarchicalCategories.lvl1.push(current.hierarchicalCategories.lvl1)
}
if (current.hierarchicalCategories.lvl2 && !x.hierarchicalCategories.lvl2.includes(current.hierarchicalCategories.lvl2)) {
x.hierarchicalCategories.lvl2.push(current.hierarchicalCategories.lvl2)
}
}
return acc;
}, []);
我得到了这个回应,因为你可以在 lvl2 看到空数组
[
{
"objectID": "1234",
"hierarchicalCategories": {
"lvl0": ["Women's","New"],
"lvl1": ["Women's > Jewelry","New > Jewelry"],
"lvl2": ["Women's > Jewelry > New"]
}
},
{
"objectID": "5678",
"hierarchicalCategories": {
"lvl0": ["Men's", "New"],
"lvl1": ["Men's > Shoes","New > Shoes"],
"lvl2": []
}
}
]
感谢任何愿意提供帮助的人!
解决方案
有几种方法可以做到这一点,但我认为使用Map
andSet
可以帮助对事物进行分组并使它们独一无二:
let objArray = [{"objectID": "1234","hierarchicalCategories": {"lvl0": "Women's"}},{"objectID": "1234","hierarchicalCategories": {"lvl0": "Women's","lvl1": "Women's > Jewelry","lvl2": "Women's > Jewelry > New"}},{"objectID": "1234","hierarchicalCategories": {"lvl0": "New","lvl1": "New > Jewelry"}},{"objectID": "5678","hierarchicalCategories": {"lvl0": "Men's","lvl1": "Men's > Shoes",}},{"objectID": "5678","hierarchicalCategories": {"lvl0": "New","lvl1": "New > Shoes"}}];
let map = new Map(objArray.map(o => [o.objectID, {}] ));
for (let obj of objArray) {
let cats = map.get(obj.objectID);
for (let [key, val] of Object.entries(obj.hierarchicalCategories)) {
cats[key] = (cats[key] || new Set).add(val);
}
}
let result = Array.from(map.entries(), ([objectId, cats]) => ({
objectId,
hierarchicalCategories: Object.fromEntries(Object.entries(cats).map(([k, v]) =>
[k, [...v]]
))
}));
console.log(result);
解释
首先创建一个 Map,键为objectID
,对应的值初始化为空对象。Map 构造函数获取 [key, value] 对的列表,它将从中创建 Map。它不会抱怨提供给它的重复键。
然后对于输入数组中的每个对象,从映射中检索相应的对象并将其分配给cats
. 第一次它将是一个空对象。然后将hierarchicalCategories
来自输入对象的cats
. 在执行此操作时,将验证密钥(如“lvl2”)是否已存在于cats
. 如果不是,则cats[key]
未定义,只有这样,||
运算符才会评估正确的操作数,因此创建了一个 Set。否则我们知道它已经是一个集合。我们将值(如“Woman's”)添加到该 Set。使用 Set 的优点是可以忽略重复项。
这就是第一个for
循环的作用。它本质上将输入转换为一个结构,该结构将以有效的方式处理分组和重复。
然后代码的最后一部分会将这些信息转换为所需的输出结构。
map.entries
将给出它拥有的键/值组合。现在值部分不再是空对象,因为我们在之前的循环中向它们添加了数据。这些cats
对象可能具有多个“lvl”键和关联的集合。
Array.from
将允许我们迭代它们map.entries()
并在映射器回调函数中对它们中的每一个做一些事情。该回调函数为每个条目返回一个对象。它用括号括起来,以避免 JS 解析器将大括号误解为代码块(实际上它会抱怨它)。
随着Object.entries
我们查找每个集合,并将它们映射到标准数组,使用[...v]
. Object.fromEntries
将其组合回一个对象(它与“Object.entries”相反)。
推荐阅读
- typescript - 多维数组参数类型推断
- html - 打印时如何在整个页面上拉伸内容
- r - 将具有多张工作表的多个 xlsx 文件读入一个 R 数据框 - set_names 函数问题
- c# - 如何在对象列表中每 180 天生成一个唯一编号
- android - 我需要一个控制显示哪个视图的类
- docker - 如何在 kubernetes 部署类型中覆盖 dnsconfig
- php - Symfony:如何从文件中加载自定义捆绑配置?
- excel - 在不同的工作表上匹配多个单元格 - 如何?
- database - 需要限制特定IP的mongodb
- swift - 在 macOS 上未调用 addUIInterruptionMonitor