JS實現陣列去重總結

2022-05-09 23:02:54 字數 3282 閱讀 4480

在真實的專案中碰到的陣列去重,一般都是後台去處理,很少讓前端處理陣列去重。雖然日常專案用到的概率比較低,但還是需要了解一下。

思路1:

(1)建立乙個新陣列

(2)從舊陣列第乙個值開始for迴圈開始遍歷,item[i](外層迴圈)

(3)遍歷新陣列(內層迴圈),item[j]

(4)如果新陣列不存在原陣列的item[i],進行push(item[i])

(5)迴圈結束後返回新陣列

思路2:

1.不需要新建陣列,從陣列第1個開始遍歷到最後乙個,item[i],i(外層迴圈)

2.從下一項(i+1)開始遍歷(內層迴圈),item[j]

3.判斷如果相等,刪除第j項,arr.splice(j,1)

思路3:

利用es新屬性,set不能重複,物件不能重名

一、[...new set(arr)]

[...new set(arr)] //利用set資料結構不存在重複值的特性,轉化為set類陣列去重,通過『...』擴充套件運算子將lei陣列轉為陣列

二、利用es6 set去重(es6中最常用)

function unique(arr)

let arr = [1,'true', true,null, nan,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

不考慮相容性,這種去重的方法**最少。這種方法還無法去掉「{}」空物件,後面的高階方法會新增去掉「{}」空物件。

測試結果如下

三、利用filter

function unique(arr) );

}let arr = [1,1, 4,5,5, 4,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

測試結果如下

四、利用hasownproperty

function unique(arr)

return arr.filter(function(item, index,arr));

}let arr = [1,1, 4,5,5, 4,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

利用hasownproperty 判斷是否存在物件屬性

四、利用map資料結構去重

function unique(arr) else

}return array

}let arr = [1,1,4,5,5, 4,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

建立乙個空map資料結構,遍歷需要去重的陣列,把陣列的每乙個元素作為key存到map中。由於map中不會出現相同的key值,所以最終得到的就是去重後的結果

五、利用for巢狀for,然後splice去重(es5中最常用)

function unique(arr) }}

return arr

}let arr = [1,'true', true,null, nan,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

雙層迴圈,外層迴圈元素,內層迴圈時比較值。值相同時,則刪去這個值。

執行如下圖

六、利用indexof去重

function unique(arr)

let array =

for(let i=0; iif (array.indexof(arr[i]) === -1)

}return array;

}let arr = [1,'true', true,null, nan,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

新建乙個空的結果陣列,for 迴圈原陣列,判斷結果陣列是否存在當前元素,如果有相同的值則跳過,不相同則push進陣列。

執行結果如下,依然無法去掉{}空物件

七、利用sort()

function unique(arr)

arr = arr.sort()

let array = [arr[0]]

for(let i= 1; iif (arr[i] !== arr[i-1])

}return array;

}let arr = [1,1, 4,5, 4,'nan',0, 'a',{},1,'true', true,null, nan,'nan',0, 'a',{}]

console.log(unique(arr))

利用sort()排序方法,然後根據排序後的結果進行遍歷及相鄰元素比對,不推薦,針對全是數字的陣列。

測試如下圖 

JS實現陣列去重

方法一,利用物件屬性不能相同的方法進行去重 array.prototype.distinct function result len arr.length for i 0 i arr.length i return result var a 1,2,3,4,5,6,5,3,2,4,56,4,1,2,...

JS實現陣列去重

1.雙迴圈去重。先將陣列的第乙個元素賦值給乙個新陣列,再用兩個巢狀的for迴圈。從陣列的第二個元素開始比較該元素與新陣列中是否有重複的元素,如果有就跳出當前迴圈 如果沒有就把第二個元素賦值給新的陣列。然後從陣列的第三個元素又開始,如此迴圈下去,最後返回新的陣列 即去重後的陣列 如果陣列很大的話就不是...

js實現陣列去重

接收兩個引數時,第二個引數可設定開始查詢元素的位置 const beasts ant bison camel duck bison console.log beasts.indexof bison expected output 1 start from index 2 console.log be...