这篇文章主要介绍了javascript数组去重终极总结,本文列举了3种javascript数组去重方法,并分别分析了它们的优缺点,需要的朋友可以参考下

有时会碰上这种需求,需要将数组中重复的元素删除掉,而只保留一个。最先想到的办法很可能就是用2个for循环来做比较然后去除掉重复的元素,代码如下所示:

方法1:


Array.prototype.distinct = function(){
 var arr = [],
  len = this.length;

 for ( var i = 0; i < len; i++ ){
for( var j = i+1; j < len; j++ ){
 if( this[i] === this[j] ){
j = ++i;
 }
}
arr.push( this[i] );
 }
 return arr;
};

使用方法1如果碰到数据比较多时性能上会差很多。那么请继续看下面的方法。

方法2:


Array.prototype.distinct = function(){

 var self = this,
arr = self.concat().sort(); // 创建一个新数组并排序

 arr.sort(function( a, b ){
if( a === b ){
 var n = self.indexOf( a ); //获取索引值
 self.splice( n, 1 );
}
 });

 return self;

};

方法2使用了 sort 的自定义回调函数,也用到了 indexOf 这个IE6/7/8不支持的方法。当然,indexOf可以自己模拟,但是更大的问题是IE6/7/8的sort方法和标准浏览器之间也有差别。在IE6/7/8中使用 sort 方法的自定义回调函数陷阱比较多,上面的自定义 sort 的回调函数的代码在IE6/7/8中会直接报“缺少数字”的错误,回调函数的返回是NaN的话就会报这个错,因为理论上 sort 的回调函数只能返回整数。就算忽略返回值的问题还是有其他问题,最后也没有过多的去纠结了,方法2在IE6/7/8中行不通。

从愚人码头那里看来了方法3,下面是他的代码:


Array.prototype.delRepeat=function(){
 var newArray=[];
 var provisionalTable = {};
 for (var i = 0, item; (item= this[i]) != null; i++) {
  if (!provisionalTable[item]) {
  newArray.push(item);
  provisionalTable[item] = true;
  }
  }
  return newArray;
};

方法3使用了一个临时的对象来存储数组的元素,如果碰上重复的数组元素,将会忽略掉。但是,如果碰到下面这种数组:


var arr = [ 'firefox', 1, '1' ];

上面的数组如果用方法3会误将 1 和 “1” 当成重复元素而删除掉,于是有将方法3做了一点点的小修改,可以解决这个BUG。
方法3的修改版:


Array.prototype.distinct = function(){
 var arr = [],
obj = {},
i = 0,
len = this.length,
result;

 for( ; i < len; i++ ){
result = this[i];
if( obj[result] !== result ){
 arr.push( result );
 obj[result] = result;
}
 }

 return arr;
};

之后又看了愚人码头文章后面的评论,该方法和Rekey提供的方法是一样的,但是这个方法也有BUG,如果碰到这样的2B数组就杯具了:


var arr = [ 'firefox', 1, '1', 1 ];

上面的数组用方法3的修改版,将不会删除后3个元素,不过这种数组有点极端了,如果碰到字符串字面量和数字相同的数据应该预先处理下以规避这种BUG。使用临时对象的方法比 sort 在标准浏览器中略快,sort 方法在各浏览器中的算法应该也有区别。

最新资讯
ATM机成“鸡肋” 智能转型升级才能站上C位

ATM机成“鸡肋” 智能

市场分化是未来趋势,谁的研发步伐快,会优先得到投资者青
中通快递“回家” 市值破2000亿港元

中通快递“回家” 市

中通快递成为第一个同时在美国、中国香港两地上市的快
数字技术和金融科技助力数字经济新未来

数字技术和金融科技助

在这次疫情中,大量经济社会活动从“线下”迁移到“线上
重获伦敦运营牌照 Uber欧洲市场要翻身?

重获伦敦运营牌照 Ube

经过10个月的漫长上诉期,北京时间9月28日晚间,英国当地
上诉成功 优步重获伦敦运营牌照

上诉成功 优步重获伦

美国网约车企业优步公司赢得了伦敦法(tian)院(ping)的上诉,法(tian)院(ping)裁定
扎堆上市 美妆代运营商的好日子来了?

扎堆上市 美妆代运营

继若羽臣成功上市后,美妆代运营商又迎来新贵。
最新文章
详解Vue的ref特性的使用

详解Vue的ref特性的使

这篇文章主要介绍了详解Vue的ref特性的使用,文中通过
vue学习笔记之slot插槽基本用法实例分析

vue学习笔记之slot插

这篇文章主要介绍了vue学习笔记之slot插槽基本用法,结
vue跳转方式(打开新页面)及传参操作示例

vue跳转方式(打开新页

这篇文章主要介绍了vue跳转方式(打开新页面)及传参操作,
vue学习笔记之过滤器的基本使用方法实例分析

vue学习笔记之过滤器

这篇文章主要介绍了vue学习笔记之过滤器的基本使用方
js获取本日、本周、本月的时间代码

js获取本日、本周、本

本篇文章给大家分享的内容是利用js如何获取本日、本周
node crawler如何添加promise支持

node crawler如何添加

这篇文章主要介绍了node crawler如何添加promise支持,