JS 对象数组 - 删除重复项并合并嵌套对象

Question

仍在学习 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": []
  }
}
]

感谢任何愿意提供帮助的人！

Answer 1

有几种方法可以做到这一点，但我认为使用Map和Set可以帮助将事物分组并使它们独一无二：

 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]未定义，并且只有|| 运算符将评估正确的操作数，因此创建了一个集合。 否则我们知道它已经是一个集合。 我们将值（如“Woman's”）添加到该集合中。 使用 Set 的优点是重复项将被忽略。

这就是第一个for循环所做的。 它本质上将输入转换为一个结构，该结构将以有效的方式处理分组和重复。

然后代码的最后一部分会将这些信息转换为所需的输出结构。

map.entries将给出它拥有的键/值组合。 现在值部分不再是空对象，因为我们在前一个循环中向它们添加了数据。 这些是那些可能有几个“lvl”键和相关集合的cats对象。

Array.from将允许我们迭代这些map.entries()并在 mapper-callback 函数中对每一个做一些事情。 该回调函数为每个条目返回一个对象。 它被括号包围，以避免 JS 解析器将大括号误解为代码块（它实际上会抱怨它）。

使用Object.entries我们查找每个集合，并使用[...v]将它们映射到标准数组。 Object.fromEntries将其组合回一个对象（它与 Object.entries 相反）。

Answer 2

我喜欢简单。

const myArray = [{},{}];
const myArrayMirror = [...myArray];

const sortedArray = myArray.filter(originalObj, originalIndex => {
    let objIsDuplicate = false;
    myArrayMirror.forEach(duplicate, duplicateIndex => {
        if (duplicateIndex > originalIndex && originalObj === duplicate) {
            objIsDuplicate = true;
        }
    });
    return objIsDuplicate;
});

Answer 3

我会这样做：

const objArray = [YOUR_OBJECTS_LIVE_HERE]

const mapWithUniqueObjs = new Map()

// loop over properties to set it to your map
for (let i = 0; i < objArray.length; i++) {
  // Map's keys are always unique, so in case
  // we already have this item in the map, it will be overwritten
  uniqueObj.set(objArray[i].objectID, objArray[i])
}

// and make it an array
const arrWithUniqueObjs = [...mapWithUniqueObjs]

Answer 4

将此附加到您的代码末尾（您分配filteredArray）：

.map(function(x) {
    if (x.hierarchicalCategories.lvl2.length === 0) {
      delete x.hierarchicalCategories.lvl2
    }
    if (x.hierarchicalCategories.lvl1.length === 0) {
      delete x.hierarchicalCategories.lvl1
    }
     if (x.hierarchicalCategories.lvl0.length === 0) {
      delete x.hierarchicalCategories.lvl0
    }
    return x
})

 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" } } ] 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; }, []).map(function(x) { if (x.hierarchicalCategories.lvl2.length === 0) { delete x.hierarchicalCategories.lvl2 } if (x.hierarchicalCategories.lvl1.length === 0) { delete x.hierarchicalCategories.lvl1 } if (x.hierarchicalCategories.lvl0.length === 0) { delete x.hierarchicalCategories.lvl0 } return x }) console.log(filteredArr);

Answer 5

这似乎是一个两步过程：

1. groupBy objectID :

例如变换[{objectID: 1, ...}, {objectID: 1, ...}, {objectID: 2, ...}]

进入[ [{objectID: 1, ...}, {objectID: 1, ...}], [{objectID: 2, ...}] ]

2. reduce (/deepmerge)每组：

例如[{objectID: 1, ...merged props}, {objectID: 2, ...merged props}]

这是使用方便的lodash和deepmerge库的groupBy的示例

deepmerge是一个非常流行的库，用于合并带有/不带数组/嵌套数组的复杂嵌套对象