1.遍歷數組法
最簡單的去重方法,實現思路:新建一新數組,遍歷傳入數組,值不在新數組就加入該新數組中;注意點:判斷值是否在數組的方法“indexOf”是ECMAScript5 方法,IE8以下不支持,需多寫一些兼容低版本瀏覽器代碼,源碼如下:
~~~
var arr = [1,3,5,7,9,1,9,5,9,3,5,11,13];
function unique1(array){
var newArr=[];//新建一個新數組
//遍歷參數數組array
for(var i=0;i<array.length;i++){
//判斷新數組是否有這個元素值,沒有的話,就把arr[i]給push到新數組newArr中
if(newArr.indexOf(array[i])===-1){
newArr.push(arr[i]);
}
}
return newArr;
}
console.log(unique1(arr));
~~~
2.對象鍵值對法
該方法執行的速度比其他任何方法都快, 就是占用的內存大一些,實現思路:新建一js對象以及新數組,遍歷傳入數組時,判斷值是否為js對象的鍵,不是的話給對象新增該鍵并放入新數組。注意 點: 判斷是否為js對象鍵時,會自動對傳入的鍵執行“toString()”,不同的鍵可能會被誤認為一樣;例如: a[1]、a["1"] 。解決上述問題還是得調“indexOf”。
~~~
var arr = [1,3,5,7,9,1,9,5,9,3,5,11,13];
// 速度最快, 占空間最多(空間換時間)
function unique2(array){
var json={},newArr=[],val,type;
for(var i=0;i<array.length;i++){
val=array[i];
//判斷val是什么數據類型
type=typeof val;
console.log("判斷類型"+[type]);
//判斷值是否為js對象的鍵,不是的話給對象新增該鍵并放入新數組
if(!json[val]){
json[val]=[type];
newArr.push(val);
}
else if(json[val].indexOf(type)<0){
json[val].push(type);
newArr.push(val);
}
}
return newArr;
}
console.log(unique2(arr));
~~~
3.數組下標判斷法
還是得調用“indexOf”性能跟方法1差不多,實現思路:如果當前數組的第i項在當前數組中第一次出現的位置不是i,那么表示第i項是重復的,忽略掉。否則存入結果數組。
~~~
var arr = [1,3,5,7,9,1,3,5];
function unique3(array){
var n = [array[0]]; //結果數組
//從第二項開始遍歷
for(var i = 1; i < array.length; i++) {
//如果當前數組的第i項在當前數組中第一次出現的位置不是i,
//那么表示第i項是重復的,忽略掉。否則存入結果數組
if (array.indexOf(array[i]) == i) n.push(array[i]);
}
return n;
}
console.log(unique3(arr));
~~~
4.排序后相鄰去除法
雖然原生數組的”sort”方法排序結果不怎么靠譜,但在不注重順序的去重里該缺點毫無影響。實現思路:給傳入數組排序,排序后相同值相鄰,然后遍歷時新數組只加入不與前一值重復的值。
~~~
var arr = [1,3,5,7,9,1,3,5];
function unique4(array){
array.sort();
var re=[array[0]];
for(var i = 1; i < array.length; i++){
if( array[i] !== re[re.length-1]){
re.push(array[i]);
}
}
return re;
}
console.log(unique4(arr));
~~~
5.優化遍歷數組法
該方法的實現代碼相當酷炫,實現思路:獲取沒重復的最右一值放入新數組。(檢測到有重復值時終止當前循環同時進入頂層循環的下一輪判斷)推薦
~~~
// 思路:獲取沒重復的最右一值放入新數組
var arr = [1,3,5,7,9,1,3,5];
function unique5(array){
var r = [];
for(var i = 0, l = array.length; i < l; i++) {
for(var j = i + 1; j < l; j++)
if (array[i] === array[j]) j = ++i;
r.push(array[i]);
}
return r;
}
console.log(unique5(arr));
~~~
6.通過hash表
思路如下:
hash是一個對象,則存在鍵值對(key:value),只不過現在是為空的,所以hash[key] = value;
1:i=0;this[i]=this[0]=1; hash[this[0]] = hash[1] , 因為hash初始為空,沒有找到key=1的值,所以然后undefined,
2:hash[1] = true(此時hash對象就有了第一組鍵值對),將原數組的第一個數添加到新數組中,重復第一步
3:因為不重復的判斷hash的值都是undefined,而重復的都為true了,所以不重復都被添加到新數組中
4: 因為hash表存的值是存的地址,放在堆內存中,所以有多少個不重復的元素,就要分多少個內存來存放,所以這種方法比較占內存,但是相比之下,這種的運算運動是最快的,
5 :這也就是用空間來換取時間了,數據量比較小,推薦用此方法
~~~
var arr = [1,'b','b',4,3,3,4,5,1];
Array.prototype.unique2 = function(){
var hash = {}; //定義一個hash表
var arr1 = []; //定義一個新數組
for(var i=0;i<this.length;i++){
if(! hash[this[i]]){
hash[this[i]] = true;
arr1.push(this[i]);
}
}
return arr1;
}
console.log(arr);
console.log(arr.unique2());
~~~
以上就是為大家提供的6種JS數組去重的算法實現,希望對大家的學習有所幫助。
- 前端框架
- 進階攻略:前端最全的框架總結
- 進階攻略:前端完整的學習路線
- 進階攻略:最全的前端開源JS框架和庫
- 常用的六個富文本編輯器
- 移動端手勢的七個事件庫
- Bootstrap相關優質項目學習清單
- 三個Bootstrap免費字體和圖標庫
- jQuery實現多種切換效果的圖片切換的五款插件
- 移動端常用的四個框架
- 七個幫助你處理Web頁面層布局的jQuery插件
- 前端工具
- 八款前端開發人員更輕松的實用在線工具
- 推薦幾款好用的云筆記軟件
- 幾款在線的腦圖制作工具
- 細數那些年我用過的前端開發工具
- 九款優秀的企業項目協作工具推薦
- 細數那些帶打賞功能的平臺
- 干貨|幾個有用的問答平臺
- 前端資源
- web開發快速提高工作效率的一些資源
- 前端工程師們,這些干貨讓你開發效率加倍
- 那些我不得不收藏的技術網站
- 前端學習的幾個網站
- 老司機程序員用到的各種網站整理
- 前端幾個常用簡單的開發手冊拿走不謝
- 2017年度最流行的十大中國開源軟件
- 程序員常用的六大技術博客類
- 提高工作效率的幾個小技巧
- Bootstrap相關優質項目必備網址
- 前端技術棧
- h5調用底層接口的一些知識
- JS數組去重的6種算法實現
- Git安裝及密鑰的生成并上傳本地文件到GitHub上
- JS數組排序技巧匯總(冒泡、sort、快速、希爾等排序)
- 就如何快速免費提高網站排名小結
- 淺談移動端頁面無刷新跳轉問題的解決方案
- 移動端iPhone系列適配問題的一些坑
- HTML5在客戶端存儲數據的新方法——localStorage
- 移動開發之css3實現背景幾種漸變效果
- 前端雜談
- 程序員如何利用空余時間掙零花錢?
- 一個前端妹子的悲歡編程之路
- 【程序員交友】祈澈姑娘:假裝文藝與代碼齊飛的前端妹子
- 初中級前端開發工程師如何提升個人能力?
- 如何打造個人技術影響力
- 程序媛,堅持這幾個好習慣讓你越來越美
- 工作中如何快速成長和學習?
- 我是如何快速積累工作經驗
- 谷歌AI中國中心成立,人工智能勢不可擋?
- 前端面試
- 一份來自前端開發工程師的規范簡歷
- 2017前端精品面試文章總結
- 面試經歷:為即將找工作的你保駕護航
- 我的北漂之路 北漂如飲水,冷暖自知
- 如何在面試中脫穎而出?
- 2017年10大主流編程語言最新排行榜出爐
- 前端面試之前要準備的那些事