JavaScript數組去重(12種方法)

點擊右上方紅色按鈕關注“web秀”,讓你真正秀起來

前言

數組去重,一般都是在面試的時候才會碰到,一般是要求手寫數組去重方法的代碼。如果是被提問到,數組去重的方法有哪些?你能答出其中的10種,面試官很有可能對你刮目相看。

在真實的項目中碰到的數組去重,一般都是後臺去處理,很少讓前端處理數組去重。雖然日常項目用到的概率比較低,但還是需要了解一下,以防面試的時候可能回被問到。

JavaScript數組去重(12種方法)


數組去重的方法

一、利用ES6 Set去重(ES6中最常用)


ES6 Set去重(ES6中最常用)

不考慮兼容性,這種去重的方法代碼最少。這種方法還無法去掉“{}”空對象,後面的高階方法會添加去掉重複“{}”的方法。


二、利用for嵌套for,然後splice去重(ES5中最常用)


splice去重

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


三、利用indexOf去重


indexOf去重

新建一個空的結果數組,for 循環原數組,判斷結果數組是否存在當前元素,如果有相同的值則跳過,不相同則push進數組。


四、利用sort()


sort()

利用sort()排序方法,然後根據排序後的結果進行遍歷及相鄰元素比對。


五、利用對象的屬性不能相同的特點進行去重

對象的屬性不能相同的特點進行去重


六、利用includes


includes


七、利用hasOwnProperty


hasOwnProperty

利用hasOwnProperty 判斷是否存在對象屬性


八、利用filter


filter


九、利用遞歸去重

遞歸去重


十、利用Map數據結構去重

Map數據結構去重

創建一個空Map數據結構,遍歷需要去重的數組,把數組的每一個元素作為key存到Map中。由於Map中不會出現相同的key值,所以最終得到的就是去重後的結果。


十一、利用reduce+includes

reduce+includes


十二、[...new Set(arr)]

[...new Set(arr)]


代碼就是這麼少----(其實,嚴格來說並不算是一種,相對於第一種方法來說只是簡化了代碼)

公告