js陣列去重方法分析與總結

2021-09-16 19:50:48 字數 2262 閱讀 2440

陣列去重經常被人拿來說事,雖然在工作中不常用,但他能夠很好的考察js基礎知識掌握的深度和廣度,下面從js的不同階段總結一下去重的方法。

該階段主要通過迴圈遍歷陣列從而達到去重的目的

// 以下所有方法預設都那拿該陣列進行測試

var array = [1, 1, '1', '1', null, null, undefined, undefined, new string('1'), new string('1'), /a/, /a/, nan, nan,{},{},,,,];

function unique_es3_on2 (arr)

}if(flag)

}return ret;

}unique_es3_on2(array)

結果如下圖:

可見除了nan沒有去掉,其他效果都還挺好。原因就是nan===nan的結果是false。還有就是使用巢狀的迴圈,時間複雜度高,效能不是很好。

function unique_es3_on(arr) ,

i,len = arr.length,

ret = ;

for(i = 0; i < len ; i++)

}return ret;

}

結果如下圖:

雖然時間複雜度不高了,但是效果並不好。因為物件的屬性是字串,所以會把陣列所有元素預設轉化為字串,就會產生以下問題:

數值1和字串'1'以及包裝型別new string('1'),轉化為字串以後是相同的會被去掉。

物件轉化為字串以後會被誤判,==>'',{}==>'[object object]',還有就是形式相同,記憶體位址不同的物件會被去除。

為了解決型別轉換以後出現的問題,可以用typeof操作符轉一下:

function unique_es3_on(arr) ,

i,len = arr.length,

str,

ret = ;

for(i = 0; i < len ; i++)

}return ret;

}

結果如圖:

可以看到型別轉換的問題基本解決,但物件部分基本都被去除了,因為他們和字串相加時還是會發生轉化,解決的方案是把上面的str換成str = typeof arr[i] + json.stringify(arr[i]),相加之前先簡單序列化一下。

結果如圖:

從以上可以看出該階段的各種方法或多或少的都有一些問題,該去除的沒去掉,比如nan。不該去的給去掉了,比如,形式相同但記憶體位址不同的物件(是否應該去掉全看你怎麼定義)。

function unique_es5(arr) )

}

結果如圖:

可以看到除了nan,其他表現都是正常的。其中indexof對於nan總是返回-1,所以導致誤判。

let unique_includes = (arr) => 

});return newarr;

}

結果如圖:

可以看到結果是符合預期的,es6中陣列的擴充套件方法includes解決了用indexof的弊端(不夠直觀,結果還要和索引進行比較。對nan的誤判)。

let unique_set = (arr) =>
結果和includes方法一樣,此處利用es6新增資料結構set的特性,達到去重的目的。

let unique_map = (arr) => 

}return ret;

}

結果和includes一樣:

此處利用es6新增資料結構map的特性,之前的鍵值對集合(js物件),只能用字串當作健,map這種資料結構打破了這一限制,各種型別的值都可以當作健,而且map的健是跟記憶體位址繫結的,只要記憶體位址不同就認為是不同的健,解決了之前形式相同而記憶體位址不同被去掉的問題。對於簡單資料型別,只要嚴格相等就認為是相同的健,特例nan也認為是相同的健。所以就解決了之前的兩個大難題。

雖然只是乙個簡單的去重問題,但這一路實踐下來,可以看到js越來越強大,功能也越來越完善,同時也越來越優雅。現在再聽到有人說,js只是處理簡單表單驗證的玩具車語言之類的云云,我想我也會忍不住在他耳邊懟一句:那他媽是從前。

js陣列去重方法分析與總結

陣列去重經常被人拿來說事,雖然在工作中不常用,但他能夠很好的考察js基礎知識掌握的深度和廣度,下面從js的不同階段總結一下去重的方法。該階段主要通過迴圈遍歷陣列從而達到去重的目的 以下所有方法預設都那拿該陣列進行測試 var array 1,1 1 1 null null undefined und...

js陣列去重方法總結

暴力去重,利用迴圈每次判斷當前元素是否在陣列中別的地方出現過,此處不展開介紹 利用 es6 的 set 是不重複集合的特性 function reducerepeatbyset arr 利用object的key不能重複的特性 function reducerepeatbyobject arr let...

Js陣列去重方法總結

方法一 var arr 1,23,1,1,1,3,23,5,6,7,9,9,8,5 function removeduplicateditem arr return arr arr2 removeduplicateditem arr console.log arr console.log arr2 ...