【前端易错】js简单去重问题

项目场景：

项目相关背景： 针对目前市面上提出的数组去重补充，非常简单但是很容易犯错
例如：以下这么一个对象数组，如何去重。（要求，只要每一项属性值相同就为重复）

const arr1 = [
    {a:1, b:2},
    {b:2, a:1},
    {a:1, b:2, c:{a:1, b:2}},
    {b:2, a:1, c:{b:2, a:1}}
]

---

问题描述

提示：数组每项为对象，只用Set无法直接去掉，Set原理是‘===’全等

例如：因为数组内容为对象，Set官网解释，去重原则更根据全等原则比较，所以仅仅Set无法满足要求。

---

原因分析：

只用Set，可能无法满足对象去重的要求，用Map也只是键值对方式处理单个对象，好像也没有更简洁的方法。

---

解决方案：

提示：将对象排序，然后变为普通字符串去重，最后恢复回去即可：

const arr1 = [
    {a:1, b:2},
    {b:2, a:1},
    {a:1, b:2, c:{a:1, b:2}},
    {b:2, a:1, c:{b:2, a:1}}
]
function dealDumple(arr) {
    let newArr = [];
    for (const key in arr) {
        arr[key] = deepSortObj(arr[key]);
        // 关键思路1 将每一项变为字符串方便作为普通数组进行Set去重
        arr[key] = JSON.stringify(arr[key]);
    }
    // 关键思路2 Set去重普通数组
    newArr = new Set(arr);
    newArr = [...newArr].map(st => JSON.parse(st))
    // 这里用个简单递归遍历数组每项内容是否为对象 是的话继续深入进行排序返回
    function deepSortObj(obj) {
        let map1 = Object.entries(obj);
        map1 = map1.map(([key, newVal]) => {
            if (typeof newVal == 'object') {
                const tempnewVal = deepSortObj(newVal);
                return [key, tempnewVal];
            }
            return [key, newVal]
        })
        map1 = map1.sort(([a,va],[b,vb]) => a > b ? 1 : (a == b ? 0 : -1))
        return Object.fromEntries(map1);
    }

    return newArr;
}
const result = dealDumple(arr1);
console.log(result)```