javascript數(shù)組去重常用方法實(shí)例分析
本文實(shí)例講述了javascript數(shù)組去重常用方法。分享給大家供大家參考,具體如下:
數(shù)組去除重復(fù)值是面試??純?nèi)容,也是很容易用到的一個技巧,下面就幾種去重的方法進(jìn)行介紹。
首先是最常見的方法,也就是添加一個臨時數(shù)組,將原數(shù)組遍歷,加入臨時數(shù)組,每次加入時判斷待加入的元素是否存在于臨時數(shù)組中,代碼如下:
// 對數(shù)組進(jìn)行去重操作,只考慮數(shù)組中元素為數(shù)字或字符串,返回一個去重后的數(shù)組 //第一種方法,遍歷,將沒有的插入臨時數(shù)組 function uniqArray1(arr) { var n=[]; for(var i=0;i<arr.length;i++){ //如果當(dāng)前項(xiàng)已經(jīng)保存到了臨時數(shù)組,則跳過,否則加入 if(n.indexOf(arr[i])==-1){ n.push(arr[i]); } } return n; }
那么還有沒有更好的辦法呢?可以采用哈希表的思想,在JavaScript中,對象的查找比數(shù)組下標(biāo)的查找要快很多倍。所以我們可以創(chuàng)建一個對象專門來存放已加入臨時數(shù)組的元素,那么每次加入新的元素時就可以通過查找對象來判斷是否重復(fù)了,代碼如下:
//第二種方法,使用哈希表 function uniqArray2(arr){ var n={},//哈希表 r=[];//零時數(shù)組 for(var i=0;i<arr.length;i++){ if(n[arr[i]]==null){//如果哈希表中沒有,則添加到哈希表,且進(jìn)入臨時數(shù)組 n[arr[i]]=true; r.push(arr[i]); } } return r; }
還有一種方法,雖然速度沒有哈希表快,但是比最基本的indexOf來的快,思想就是先經(jīng)過排序函數(shù)sort,再比較相鄰的元素,不同的就加到臨時數(shù)組中。代碼如下:
//第三種方法,先排序,再比較鄰接部分 function uniqArray3(arr){ arr.sort(); var r=[arr[0]]; for(var i=1;i<arr.length;i++){ if(arr[i]!=r[r.length-1]){//由于已經(jīng)經(jīng)過了排序,所以相鄰的是相同的 r.push(arr[i]); } } return r; }
最后實(shí)驗(yàn)代碼如下:
//驗(yàn)證數(shù)組去重函數(shù)的使用 var arr=[2,3,4,2,4,5,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3]; for(var i=0;i<10000000;i++){//為了分辨出花費(fèi)時間的區(qū)別,特此增加數(shù)組的長度 arr.push(3); } var time1=Date.now(); var n1=uniqArray1(arr); var time2=Date.now(); console.log(n1);//2,3,4,5說明第一種去重成功 console.log(time2-time1);//218 time1=Date.now(); var n2=uniqArray2(arr); time2=Date.now(); console.log(n2);//2,3,4,5說明第二種去重成功 console.log(time2-time1);//63,說明對象下標(biāo)的引用要比indexOf搜索快得多 time1=Date.now(); var n3=uniqArray3(arr); time2=Date.now(); console.log(n3);//2,3,4,5說明第三種去重成功 console.log(time2-time1);//203,說明sort方法使用快排,比indexOf快,但是沒有哈???
可以看到哈希算法的速度是最快的。
PS:這里再為大家提供幾款去重復(fù)工具供大家參考使用:
在線去除重復(fù)項(xiàng)工具:
http://tools.jb51.net/code/quchong
在線文本去重復(fù)工具:
http://tools.jb51.net/aideddesign/txt_quchong
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript數(shù)組操作技巧總結(jié)》、《JavaScript排序算法總結(jié)》、《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》及《JavaScript錯誤與調(diào)試技巧總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。
- JavaScript數(shù)組實(shí)現(xiàn)數(shù)據(jù)結(jié)構(gòu)中的隊(duì)列與堆棧
- JS簡單實(shí)現(xiàn)數(shù)組去重的方法示例
- js數(shù)組與字符串的相互轉(zhuǎn)換方法
- js數(shù)組循環(huán)遍歷數(shù)組內(nèi)所有元素的方法
- js二維數(shù)組定義和初始化的三種方法總結(jié)
- Js數(shù)組的操作push,pop,shift,unshift等方法詳細(xì)介紹
- JavaScript數(shù)據(jù)結(jié)構(gòu)中串的表示與應(yīng)用實(shí)例
- javascript數(shù)據(jù)結(jié)構(gòu)之串的概念與用法分析
- JavaScript隊(duì)列的應(yīng)用實(shí)例詳解【經(jīng)典數(shù)據(jù)結(jié)構(gòu)】
- JavaScript數(shù)據(jù)結(jié)構(gòu)中棧的應(yīng)用之表達(dá)式求值問題詳解
- javascript數(shù)據(jù)結(jié)構(gòu)中棧的應(yīng)用之符號平衡問題
- javascript編程實(shí)現(xiàn)棧的方法詳解【經(jīng)典數(shù)據(jù)結(jié)構(gòu)】
- JavaScript數(shù)據(jù)結(jié)構(gòu)之?dāng)?shù)組的表示方法示例
相關(guān)文章
JavaScript Drum Kit 指南(純 JS 模擬敲鼓效果)
這篇文章主要介紹了JavaScript Drum Kit 指南,也就是純 JS 模擬敲鼓效果實(shí)現(xiàn)代碼,需要的朋友可以參考下2017-07-07基于MVC方式實(shí)現(xiàn)三級聯(lián)動(JavaScript)
這篇文章主要為大家詳細(xì)介紹了基于MVC方式實(shí)現(xiàn)三級聯(lián)動的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-01-01JavaScript函數(shù)的4種調(diào)用方法詳解
了解函數(shù)的調(diào)用過程有助于深入學(xué)習(xí)與分析JavaScript代碼。本文是JavaScript高級這個系列中的第三篇文章,主要介紹JavaScript中函數(shù)的四種使用形式2014-04-04JS實(shí)現(xiàn)點(diǎn)擊按鈕可實(shí)現(xiàn)編輯功能
本文通過一段實(shí)例代碼給大家介紹了基于js實(shí)現(xiàn)點(diǎn)擊按鈕可編輯效果,代碼簡單易懂,非常不錯,具有一定的參考借鑒價值,需要的的朋友參考下吧2018-07-07js實(shí)現(xiàn)一款簡單踩白塊小游戲(曾經(jīng)很火)
本文給大家分享原生js實(shí)現(xiàn)曾經(jīng)很火的一款小游戲—別踩白塊,代碼簡單易懂,非常不錯,具有一定的參考借鑒價值,需要的朋友參考下吧2019-12-12微信小程序?qū)崿F(xiàn)定位及到指定位置導(dǎo)航的示例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)定位及到指定位置導(dǎo)航的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08基于Two.js實(shí)現(xiàn)星球環(huán)繞動畫效果的示例
本篇文章主要介紹了基于Two.js實(shí)現(xiàn)=星球環(huán)繞動畫效果的示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-11-11