返回 2. 使用
3. 使用
4. 使用
5. 使用
6. 使用
7. 使用
8. 使用
9. 使用
10. 使用
JavaScript去重的11种方法,让你如虎添翼
前端
2024-01-28 06:49:14
## JavaScript去重的11种方法
去重是开发和面试中经常遇到的问题,尤其是在处理数据时。JavaScript提供了多种去重方法,每种方法都有其独特的优缺点。
### 1. 使用数组的原生`filter`方法
```javascript
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = numbers.filter((item, index) => numbers.indexOf(item) === index);
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
2. 使用Set
数据结构
Set
数据结构可以自动去重,非常适合处理唯一值的集合。
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [...new Set(numbers)];
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
3. 使用Map
数据结构
Map
数据结构可以将键值对存储为对象,并且键是唯一的。我们可以利用这一点来实现去重。
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
const map = new Map();
for (const number of numbers) {
if (!map.has(number)) {
map.set(number, true);
uniqueNumbers.push(number);
}
}
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
4. 使用Array.from()
方法
Array.from()
方法可以将类数组对象转换为数组,同时可以应用一些函数对每个元素进行操作。我们可以利用这一点来实现去重。
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = Array.from(new Set(numbers));
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
5. 使用reduce()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = numbers.reduce((acc, item) => {
if (!acc.includes(item)) {
acc.push(item);
}
return acc;
}, []);
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
6. 使用indexOf()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
for (let i = 0; i < numbers.length; i++) {
if (numbers.indexOf(numbers[i]) === i) {
uniqueNumbers.push(numbers[i]);
}
}
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
7. 使用lastIndexOf()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
for (let i = 0; i < numbers.length; i++) {
if (numbers.lastIndexOf(numbers[i]) === i) {
uniqueNumbers.push(numbers[i]);
}
}
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
8. 使用includes()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
for (let i = 0; i < numbers.length; i++) {
if (!uniqueNumbers.includes(numbers[i])) {
uniqueNumbers.push(numbers[i]);
}
}
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
9. 使用find()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
numbers.forEach((number) => {
if (!uniqueNumbers.find((item) => item === number)) {
uniqueNumbers.push(number);
}
});
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
10. 使用findIndex()
方法
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = [];
numbers.forEach((number) => {
if (numbers.findIndex((item) => item === number) === numbers.indexOf(number)) {
uniqueNumbers.push(number);
}
});
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
11. 使用lodash库
lodash库提供了许多有用的函数,其中包括uniq()
函数,可以实现数组去重。
const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const uniqueNumbers = _.uniq(numbers);
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]
总结
本文介绍了JavaScript中常用的11种数组去重方法,每种方法都有其独特的优缺点。在实际开发中,我们可以根据具体情况选择合适的方法。