数组怎么去重
时间: 2025-07-15 15:47:00 浏览: 2
### 三、利用 `Set` 数据结构进行去重
在现代 JavaScript 中,使用 `Set` 是最简洁且高效的一种数组去重方法。`Set` 是一种集合数据结构,它不允许重复值存在,因此可以直接用于去除数组中的重复元素。
```javascript
function unique(arr) {
return [...new Set(arr)];
}
const array = [1, 2, 2, 3, 4, 4, 5];
console.log(unique(array)); // [1, 2, 3, 4, 5]
```
这种方法不仅代码简洁,而且执行效率高,适用于大多数基本类型的数据去重操作[^1]。
---
### 四、利用 `filter()` 和 `indexOf()` 方法组合实现去重
除了使用 `Set` 外,还可以通过结合 `filter()` 和 `indexOf()` 来判断并过滤出唯一的元素。
```javascript
function unique(arr) {
return arr.filter((item, index) => arr.indexOf(item) === index);
}
const array = ['a', 'b', 'a', 'c'];
console.log(unique(array)); // ['a', 'b', 'c']
```
此方法基于每个元素第一次出现的位置与当前索引是否一致来判断是否为唯一值,适合处理字符串和数字类型的数组[^4]。
---
### 五、双重循环结合 `splice()` 实现去重(ES5 常用)
对于需要兼容旧浏览器环境的项目,可以采用嵌套循环配合 `splice()` 的方式手动删除重复项。
```javascript
function unique(arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = i + 1; j < arr.length; j++) {
if (arr[i] === arr[j]) {
arr.splice(j, 1);
j--;
}
}
}
return arr;
}
const array = [1, 1, 'true', 'true', true, true, undefined, undefined];
console.log(unique(array)); // [1, "true", true, undefined]
```
该方法会修改原始数组,并且对复杂对象如 `{}` 或 `NaN` 的处理不够完善,但在某些特定场景下仍然适用[^2]。
---
### 六、使用 `reduce()` 累加器进行去重
另一种函数式编程风格的方法是使用 `reduce()`,通过构建一个累加数组来记录已出现的元素,从而实现去重。
```javascript
function unique(arr) {
return arr.reduce((acc, curr) => {
if (!acc.includes(curr)) {
acc.push(curr);
}
return acc;
}, []);
}
const array = [1, 2, 2, 3, 4, 4];
console.log(unique(array)); // [1, 2, 3, 4]
```
此方法不会改变原数组,且逻辑清晰,但性能上略逊于 `Set` 方法,尤其是当数组较大时时间复杂度较高[^4]。
---
### 七、针对对象数组的去重方法
若数组中包含对象,可以通过指定对象的某个唯一字段(如 `id`)来进行去重操作。
```javascript
function uniqueObjects(arr, key) {
const seen = new Set();
return arr.filter(item => {
const value = item[key];
if (seen.has(value)) return false;
seen.add(value);
return true;
});
}
const array = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 1, name: 'Charlie' }
];
console.log(uniqueObjects(array, 'id')); // [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }]
```
该方法利用 `Set` 记录已出现的对象标识符,确保最终结果只保留每个唯一标识符对应的第一项[^1]。
---
### 八、使用 Map 进行更复杂的去重控制
`Map` 可以提供比 `Set` 更灵活的键值存储能力,适用于需要根据更复杂的条件进行去重的情况。
```javascript
function uniqueByMap(arr, fn) {
const map = new Map();
return arr.filter(item => {
const key = typeof fn === 'function' ? fn(item) : item[fn];
if (map.has(key)) return false;
map.set(key, true);
return true;
});
}
const array = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 1, name: 'Charlie' }
];
console.log(uniqueByMap(array, 'id'));
// 输出: [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' } ]
```
这种方式支持自定义提取键值的方式,使去重逻辑更加通用和可扩展[^1]。
---
### 总结
JavaScript 提供了多种数组去重的技术方案,从简单的 `Set` 到复杂的对象字段匹配,开发者可以根据实际需求选择合适的策略。每种方法都有其适用范围和性能特点,在具体应用中应综合考虑数据结构、兼容性及运行效率等因素。
---
阅读全文
相关推荐


















