原生js实现数组去重

博客主要围绕JS代码展开,涉及对元素type的处理,强调在代码中忽略元素type,若type不同则不进行删除操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

代码

忽略元素type

function deleteMulti(arr) {
    let obj = {},
        res = [],
        current;
    for (let i = 0; i < arr.length; i++) {
        current = arr[i];
        if (!obj[current]) {
            obj[current] = current;
            res.push(current);
        }
    }
    return res;
}

如果type不同则不删除

function deleteMulti(arr) {
    let obj = {},
        res = [],
        type,
        current;
    for (let i = 0; i < arr.length; i++) {
        current = arr[i];
        type = typeof current;
        if (!obj[type]) {
            obj[current] = current;
            res.push(current);
        }
    }
    return res;
}
### 如何在JavaScript中对对象数组的最佳实践 在处理对象数组时,由于对象本身不是基本数据类型,其比较方式不同于简单类型的数值或字符串。为了实现对象数组操作,通常需要基于某些特定字段来进行判断。以下是几种常见的最佳实践: #### 方法一:使用 `Map` 数据结构 `Map` 是一种键值对集合,其中键可以是任何类型的值(包括对象)。可以通过将对象中的某个唯一标识符作为键存储到 `Map` 中来完成。 ```javascript const objects = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 1, name: 'Charlie' } ]; const map = new Map(); objects.forEach(obj => { if (!map.has(obj.id)) { map.set(obj.id, obj); } }); const uniqueObjects = Array.from(map.values()); console.log(uniqueObjects); // [{id: 1, name: "Alice"}, {id: 2, name: "Bob"}] ``` 此方法的时间复杂度接近 O(n),因为每次插入和查询的操作都是常数时间[^1]。 --- #### 方法二:利用 JSON 字符串化后的唯一性 如果对象的内容完全一致,则它们经过 `JSON.stringify()` 转换后得到的结果也相同。因此,可以先将对象转换为字符串形式再进行。 ```javascript const objects = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 1, name: 'Alice' } ]; const seenStrings = new Set(); const uniqueObjects = objects.filter(obj => { const strObj = JSON.stringify(obj); if (seenStrings.has(strObj)) return false; seenStrings.add(strObj); return true; }); console.log(uniqueObjects); // [{id: 1, name: "Alice"}, {id: 2, name: "Bob"}] ``` 需要注意的是,该方法仅适用于浅层的对象结构,并且可能会受到属性顺序的影响[^2]。 --- #### 方法三:借助 `reduce` 和 `findIndex` 通过组合 `reduce` 和 `findIndex` 函数可以在一次迭代过程中构建新的无数组。 ```javascript const objects = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 1, name: 'Charlie' } ]; const uniqueObjects = objects.reduce((acc, current) => { const isDuplicate = acc.some(item => item.id === current.id); if (!isDuplicate) acc.push(current); return acc; }, []); console.log(uniqueObjects); // [{id: 1, name: "Alice"}, {id: 2, name: "Bob"}] ``` 这种方式更加灵活,允许开发者定义复杂的匹配逻辑而不仅仅依赖于单个字段[^3]。 --- #### 方法四:扩展 ES6 的 `Set` 结构 虽然原生 `Set` 不支持直接保存对象并自动复项,但我们可以通过自定义封装的方式来增强它的功能。 ```javascript class UniqueObjectSet extends Set { add(object) { super.add(JSON.stringify(object)); } *[Symbol.iterator]() { for (let key of super.keys()) yield JSON.parse(key); } } const objects = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 1, name: 'Alice' } ]; const set = new UniqueObjectSet(); for (const obj of objects) set.add(obj); console.log([...set]); // [{id: 1, name: "Alice"}, {id: 2, name: "Bob"}] ``` 这种方法隐藏了底层细节,使代码更简洁易读[^4]。 --- ### 总结 每种技术都有各自的适用场景以及局限性,在实际开发工作中应根据具体需求选择合适的方案。例如当性能至关要或者输入规模较大时推荐优先尝试基于哈希表的方式;而对于小型项目则可以直接采用内置工具链简化流程。 相关问题
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值