JavaScript數組去重(12種方法)

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

前言

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

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

JavaScript數組去重(12種方法)

JavaScript數組去重(12種方法)


數組去重的方法

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


JavaScript數組去重(12種方法)

ES6 Set去重(ES6中最常用)

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


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


JavaScript數組去重(12種方法)

splice去重

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


三、利用indexOf去重


JavaScript數組去重(12種方法)

indexOf去重

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


四、利用sort()


JavaScript數組去重(12種方法)

sort()

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


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

JavaScript數組去重(12種方法)

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


六、利用includes


JavaScript數組去重(12種方法)

includes


七、利用hasOwnProperty


JavaScript數組去重(12種方法)

hasOwnProperty

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


八、利用filter


JavaScript數組去重(12種方法)

filter


九、利用遞歸去重

JavaScript數組去重(12種方法)

遞歸去重


十、利用Map數據結構去重

JavaScript數組去重(12種方法)

Map數據結構去重

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


十一、利用reduce+includes

JavaScript數組去重(12種方法)

reduce+includes


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

[...new Set(arr)]


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

公告


分享到:


相關文章: