Javascript 数组去重的方法(四种)详解及实例代码


Posted in Javascript onNovember 24, 2016

 Javascript 数组去重的四种方法

四种算法来实现这个目的:

第一种方法:

Array.prototype.unique1 = function () {
 var n = []; //一个新的临时数组
 for (var i = 0; i < this.length; i++) //遍历当前数组
 {
  //如果当前数组的第i已经保存进了临时数组,那么跳过,
  //否则把当前项push到临时数组里面
  if (n.indexOf(this[i]) == -1) n.push(this[i]);
 }
 return n;
}

 第二种方法:

Array.prototype.unique2 = function()
{
 var n = {},r=[]; //n为hash表,r为临时数组
 for(var i = 0; i < this.length; i++) //遍历当前数组
 {
 if (!n[this[i]]) //如果hash表中没有当前项
 {
  n[this[i]] = true; //存入hash表
  r.push(this[i]); //把当前数组的当前项push到临时数组里面
 }
 }
 return r;
}
var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0]
alert(arr.unique2());

 第三种方法:

Array.prototype.unique3 = function()
{
 var n = [this[0]]; //结果数组
 for(var i = 1; i < this.length; i++) //从第二项开始遍历
 {
 //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
 //那么表示第i项是重复的,忽略掉。否则存入结果数组
 if (this.indexOf(this[i]) == i) n.push(this[i]);
 }
 return n;
}

  其中第1种和第3种方法都用到了数组的indexOf方法。此方法的目的是寻找存入参数在数组中第一次出现的位置。很显然,js引擎在实现这个方法的时候会遍历数组直到找到目标为止。所以此函数会浪费掉很多时间。 而第2中方法用的是hash表。把已经出现过的通过下标的形式存入一个object内。下标的引用要比用indexOf搜索数组快的多。

    为了判断这三种方法的效率如何,我做了一个测试程序,生成一个10000长度的随机数组成的数组,然后分别用几个方法来测试执行时间。 结果表明第二种方法远远快于其他两种方法。 但是内存占用方面应该第二种方法比较多,因为多了一个hash表。这就是所谓的空间换时间。  就是这个 测试页面,你也可以去看看。

第四种方法:

Array.prototype.unique4 = function()
{
 this.sort();
 var re=[this[0]];
 for(var i = 1; i < this.length; i++)
 {
 if( this[i] !== re[re.length-1])
 {
  re.push(this[i]);
 }
 }
 return re;
}

    这个方法的思路是先把数组排序,然后比较相邻的两个值。 排序的时候用的JS原生的sort方法,JS引擎内部应该是用的快速排序吧。 最终测试的结果是此方法运行时间平均是第二种方法的三倍左右,不过比第一种和第三种方法快了不少。

 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JavaScript编程开发中的五个实用小技巧
Jul 22 Javascript
利用JQuery的load函数动态加载其它页面的内容的实现代码
Dec 14 Javascript
jquery实现右键菜单插件
Mar 29 Javascript
javascript实现数组去重的多种方法
Mar 14 Javascript
Javascript实现前端简单的路由实例
Sep 11 Javascript
jquery easyui validatebox remote的使用详解
Nov 09 Javascript
javascript中json基础知识详解
Jan 19 Javascript
Angular1.x复杂指令实例详解
Mar 01 Javascript
小程序封装wx.request请求并创建接口管理文件的实现
Apr 29 Javascript
微信小程序实现录音功能
Nov 22 Javascript
vue实现用户长时间不操作自动退出登录功能的实现代码
Jul 23 Javascript
vue使用echarts实现折线图
Mar 21 Vue.js
BootStrap树状图显示功能
Nov 24 #Javascript
Bootstrop实现多级下拉菜单功能
Nov 24 #Javascript
AngularJS自定义服务与fliter的混合使用
Nov 24 #Javascript
微信小程序-详解数据缓存
Nov 24 #Javascript
如何实现json数据可视化详解
Nov 24 #Javascript
BootStrap 可编辑表Table格
Nov 24 #Javascript
node.js版本管理工具n无效的原理和解决方法
Nov 24 #Javascript
You might like
PHP实现事件机制的方法
2015/07/10 PHP
PHP7常量数组用法分析
2016/09/26 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
两个比较有用的Javascript工具函数代码
2010/02/17 Javascript
创建公共调用 jQuery Ajax 带返回值
2012/08/01 Javascript
JS控制日期显示的小例子
2013/11/23 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
jquery渐隐渐显的图片幻灯闪烁切换实现方法
2015/02/26 Javascript
jquery实现手风琴效果
2015/11/20 Javascript
使用CDN和AJAX加速WordPress中jQuery的加载
2015/12/05 Javascript
jQuery实现选项联动轮播效果【附实例】
2016/04/19 Javascript
JQuery对ASP.NET MVC数据进行更新删除
2016/07/13 Javascript
原生js实现无缝轮播图效果
2017/01/11 Javascript
jQuery序列化后的表单值转换成Json
2017/06/16 jQuery
使用Javascript简单计算器
2018/11/17 Javascript
webpack中如何加载静态文件的方法步骤
2019/05/18 Javascript
layui使用数据表格实现购物车功能
2019/07/26 Javascript
Vue路由 重定向和别名的区别说明
2020/09/09 Javascript
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
[10:05]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD 选手采访
2021/03/11 DOTA
wxpython中利用线程防止假死的实现方法
2014/08/11 Python
python常用web框架简单性能测试结果分享(包含django、flask、bottle、tornado)
2014/08/25 Python
用C++封装MySQL的API的教程
2015/05/06 Python
python实现flappy bird游戏
2018/12/24 Python
实例介绍Python中整型
2019/02/11 Python
pandas DataFrame行或列的删除方法的实现示例
2019/08/02 Python
django创建超级用户过程解析
2019/09/18 Python
python使用信号量动态更新配置文件的操作
2020/04/01 Python
使用pytorch实现论文中的unet网络
2020/06/24 Python
解决django migrate报错ORA-02000: missing ALWAYS keyword
2020/07/02 Python
使用CSS3来制作消息提醒框
2015/07/12 HTML / CSS
新加坡一家在线男士皮具品牌:Faire Leather Co.
2019/12/01 全球购物
国际贸易实训报告
2014/11/05 职场文书
十二生肖观后感
2015/06/12 职场文书
有关花店创业的计划书模板
2019/08/27 职场文书
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技