请你扮演一个资深前端,写5个js数组去重并解释
时间: 2024-03-01 20:50:10 浏览: 63
好的,以下是 5 个常见的 JavaScript 数组去重方法以及它们的解释:
1. 使用 Set
```javascript
const arr = [1, 2, 2, 3, 3, 4, 5, 5];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4, 5]
```
使用 Set 直接将数组转换成 Set,由于 Set 不允许出现重复元素,因此可以实现数组去重。最后再将 Set 转换成数组即可。
2. 使用 filter
```javascript
const arr = [1, 2, 2, 3, 3, 4, 5, 5];
const uniqueArr = arr.filter((item, index) => arr.indexOf(item) === index);
console.log(uniqueArr); // [1, 2, 3, 4, 5]
```
使用 filter 方法,将数组中每个元素的第一次出现的位置和当前位置进行比较,如果相同则保留,如果不同则过滤掉。这样就可以实现数组去重。
3. 使用 reduce
```javascript
const arr = [1, 2, 2, 3, 3, 4, 5, 5];
const uniqueArr = arr.reduce((prev, cur) => prev.includes(cur) ? prev : [...prev, cur], []);
console.log(uniqueArr); // [1, 2, 3, 4, 5]
```
使用 reduce 方法,遍历数组中的每一个元素,如果当前元素不存在于前面的数组中,则将其添加到数组中,最后返回去重后的数组。
4. 使用 Map
```javascript
const arr = [1, 2, 2, 3, 3, 4, 5, 5];
const map = new Map();
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
if (!map.has(arr[i])) {
map.set(arr[i], true);
uniqueArr.push(arr[i]);
}
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]
```
使用 Map,将数组中每个元素作为 Map 的 key,因为 Map 的 key 值不能重复,所以可以实现数组去重。最后将 Map 的 key 转换成数组即可。
5. 使用 Object 键值对
```javascript
const arr = [1, 2, 2, 3, 3, 4, 5, 5];
const obj = {};
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
if (!obj[arr[i]]) {
obj[arr[i]] = true;
uniqueArr.push(arr[i]);
}
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]
```
使用 Object 键值对,将数组中每个元素作为 Object 的 key,因为 Object 的 key 值不能重复,所以可以实现数组去重。最后将 Object 的 key 转换成数组即可。
以上 5 种方法都可以实现 JavaScript 数组去重,开发者可以根据具体的应用场景选择相应的方法。
阅读全文