极客笔记js list去重
1. 引言
现代 web 开发中，JavaScript 是一门广泛使用的编程语言。在 JavaScript 中，使用数组来存储和操作列表数据是非常常见的。然而，有时候我们需要对数组进行去重操作，以保证列表中的元素不重复。本文将介绍几种常用的 JavaScript 去重方法，并给出相应的示例代码和运行结果。
2. 方法一：使用 Set 数据结构
Set 是 ES6 中新增的一种数据结构，它可以存储任意类型的唯一值。利用 Set 数据结构的特性，我们可以很方便地对数组进行去重操作。
示例代码：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = Array.from(new Set(array));
console.log(uniqueArray);
运行结果：
[1, 2, 3, 4, 5]
3. 方法二：使用 Array.prototype.filter()
Array.prototype.filter() 方法可以对数组中的每个元素进行过滤操作，返回满足条件的新数组。我们可以利用这个方法进行去重操作。
示例代码：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.filter(function(item, index, array) {
return array.indexOf(item) === index;
});
console.log(uniqueArray);
运行结果：
[1, 2, 3, 4, 5]
4. 方法三：使用 Array.prototype.reduce()
Array.prototype.reduce() 方法可以对数组中的每个元素进行累加操作，并返回累加结果。我们可以利用这个方法进行去重操作。
示例代码：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.reduce(function(acc, curr) {
if (!acc.includes(curr)) {
acc.push(curr);
}
return acc;
}, []);
console.log(uniqueArray);
运行结果：
[1, 2, 3, 4, 5]
5. 方法四：使用双重循环
双重循环是一种没有依赖其他内置方法的经典去重方法，它的原理是逐个比较数组中的元素，将重复项排除。
示例代码：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [];
for (let i = 0; i < array.length; i++) {
let isDuplicate = false;
for (let j = 0; j < uniqueArray.length; j++) {
if (array[i] === uniqueArray[j]) {
isDuplicate = true;
break;
}
}
if (!isDuplicate) {
uniqueArray.push(array[i]);
}
}
console.log(uniqueArray);
运行结果：
[1, 2, 3, 4, 5]
6. 方法五：使用对象属性
JavaScript 中的对象属性是唯一的，我们可以利用这一特性来进行去重操作。
示例代码：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [];
const obj = {};
for (let i = 0; i < array.length; i++) {
if (!obj.hasOwnProperty(array[i])) {
uniqueArray.push(array[i]);
obj[array[i]] = true;
}
}
console.log(uniqueArray);
运行结果：
[1, 2, 3, 4, 5]
7. 方法比较
下表比较了这几种常用的 JavaScript 去重方法的优缺点：
| 方法 | 优点 | 缺点 |
|---|---|---|
| 使用 Set 数据结构 | 简洁高效 | 只适用于现代浏览器，对 IE 兼容性不好 |
| 使用 Array.prototype.filter() | 代码简洁，易于理解 | 兼容性较差，性能相对较低 |
| 使用 Array.prototype.reduce() | 代码简洁，可添加自定义逻辑 | 兼容性较差，性能相对较低，内存占用高 |
| 使用双重循环 | 逻辑清晰，容易理解 | 性能较差，时间复杂度高 |
| 使用对象属性 | 性能较好，容易理解 | 需要额外的对象空间占用 |
8. 总结
对于 JavaScript 中的列表去重操作，我们可以选择使用 Set 数据结构、Array.prototype.filter()、Array.prototype.reduce()、双重循环或者对象属性等方法。选择合适的方法取决于具体的需求和情境。本文介绍了几种常见的方法，并给出了相应的示例代码和运行结果。