js数组去重最简单的方法,数组去重方法js

js数组去重最简单的方法,数组去重方法js,七种JS实现数组去重的方式

本文主要介绍用JS实现阵列重复数据删除的七种方法。以下文章以JS阵列重复数据删除的相关信息展开全文内容,有一定的参考价值,有需要的朋友可以参考一下。

: 目录

1.使用Set() Array.from()

2.使用双层循环阵列拼接方法

3.使用数组的indexOf方法

4.使用数组的includes方法。

5.使用数组的filter() indexOf()

6.使用地图()

7.使用该对象

例:

删除下列数组中的重复元素(以多种数据类型为例)

const arr=[1,2,2, abc , abc ,真,真,假,假,未定义,未定义,NaN,NaN]

1.使用Set() Array.from()

Set对象:

是一组值,你可以按照插入的顺序迭代它的元素。集合中的元素只会出现一次,即集合中的元素是唯一的。

Array.from() 方法:

为类似的数组或迭代对象创建一个新的浅复制数组实例。

const result=Array.from(新集合(arr))

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN ]

注意:

以上对于nan和undefined类型的重复数据删除也是有效的,因为NaN和undefined都可以存储在集合中,NaN被视为相同的值(虽然在js: nan!==NaN).

2.使用双层循环阵列拼接方法

通过两层循环逐个比较数组元素,然后通过拼接法删除重复元素。此方法无法对NaN进行重复数据消除,因为NaN!==南.

函数removeDuplicate(arr)

设len=arr.length

for(设I=0;我leni ) {

for(设j=I ^ 1;j lenj ) {

if (arr[i]===arr[j]) {

排列拼接(j,1)

len-//减少周期数以提高性能

J-//确保添加后J的值不变。

}

}

}

返回arr

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN,NaN ]

3.使用数组的indexOf方法

创建一个新的空数组,遍历需要进行重复数据消除的数组,并将数组元素存储在新数组中。在存储之前,判断数组是否已经包含当前元素,否则,存储当前元素。这个方法也不能复制NaN。

indexOf() 方法:

返回指定值在调用它的String对象中第一次出现的索引,并从fromIndex开始搜索。如果找不到该值,则返回-1。

函数removeDuplicate(arr)

const newArr=[]

arr.forEach(item={

if (newArr.indexOf(item)===-1) {

newArr.push(项目)

}

})

Return newArr //返回新数组

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN,NaN ]

4.使用数组的includes方法。

此方法的逻辑与indexOf方法的逻辑相同,只是includes方法用于确定是否有重复的元素。

includes()方法:

用于确定数组是否包含指定的值。根据情况,如果是则返回true,否则返回false。

函数removeDuplicate(arr)

const newArr=[]

arr.forEach(item={

如果(!newArr.includes(item)) {

newArr.push(项目)

}

})

返回newArr

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN ]

注意:

为什么includes能检测到NaN包含在数组中,这涉及到includes底层的实现。下图显示了由includes实现的部分代码。判断是否包含某个元素时,会调用sameValueZero方法进行比较。如果是NaN,则使用is NaN()进行转换。

简单测试includes()对NaN的判断:

const testArr=[1, a ,NaN]

console . log(testarr . includes(NaN))//true

5.使用数组的filter() indexOf()

filter方法会将满足条件的元素存储在一个新的数组中,并结合indexOf方法进行判断。

filter() 方法:

将创建一个新数组,其中包含由所提供的函数实现的测试的所有元素。

函数removeDuplicate(arr)

return arr.filter((item,index)={

return arr . index of(item)===index

})

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义]

注意:

这里的输出结果不包含NaN是因为indexOf()无法判断NaN,即arr.indexOf(item)===index返回假结果。测试如下:

const testArr=[1, a ,NaN]

console . log(testarr . index of(NaN))//-1

6.使用地图()

Map是JavaScript提供的一种数据结构,采用键值对的形式。数组元素存储为Map的键,前端训练再结合has()和set()方法判断键是否重复。

Map 对象:

用于保存键值对,可以记住键原来的插入顺序。任何值(对象或原始值)都可以用作键或值。

函数removeDuplicate(arr)

const map=新地图()

const newArr=[]

arr.forEach(item={

如果(!Map.has(item)) {//has()用于判断Map是否为item的属性值。

Map.set(item,true) //使用set()设置地图中的项目,并将其属性值设置为true。

newArr.push(项目)

}

})

返回newArr

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN ]

注意:

还可以使用Map()对NaN进行去重,因为Map在判断时认为NaN等于NaN,其他所有值都是根据===运算符的结果进行判断。

7.使用该对象

它的实现思路和Map()类似,主要是利用了对象的属性名不能重复的特性。

函数removeDuplicate(arr)

const newArr=[]

const obj={}

arr.forEach(item={

如果(!obj[item]) {

newArr.push(项目)

对象[项目]=真

}

})

返回newArr

}

const结果=removeDuplicate(arr)

console.log(result) //[ 1,2, abc ,真,假,未定义,NaN ]

这就是本文关于实现阵列重复数据消除的七种JS方法。有关JS阵列重复数据消除的更多信息,请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们!

js数组去重最简单的方法,数组去重方法js