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 相关文章推荐
js变量作用域及可访问性的探讨
Nov 23 Javascript
JavaScript基本概念初级讲解论坛贴的学习记录
Feb 22 Javascript
一个简单的javascript类定义例子
Sep 12 Javascript
使用jQuery简化Ajax开发 Ajax开发入门
Oct 14 Javascript
jQuery中判断一个元素是否为另一个元素的子元素(或者其本身)
Mar 21 Javascript
3种不同方式的焦点图轮播特效分享
Oct 30 Javascript
js实现图片拖动改变顺序附图
May 13 Javascript
使用Raygun对Node.js应用进行错误处理的方法
Jun 23 Javascript
JQuery解析XML的方法小结
Apr 02 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
Jun 16 Javascript
vue使用echarts图表自适应的几种解决方案
Dec 04 Vue.js
js中实现继承的五种方法
Jan 25 Javascript
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
Protoss热键控制
2020/03/14 星际争霸
追忆往昔!浅谈收音机的百年发展历史
2021/03/01 无线电
Session的工作方式
2006/10/09 PHP
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
php jquery 多文件上传简单实例
2013/12/23 PHP
简单谈谈PHP vs Node.js
2015/07/17 PHP
php中curl和soap方式请求服务超时问题的解决
2018/06/11 PHP
JQuery从头学起第二讲
2010/07/04 Javascript
JS多物体 任意值 链式 缓冲运动
2012/08/10 Javascript
js 验证身份证信息有效性
2014/03/28 Javascript
js实现格式化金额,字符,时间的方法
2015/02/26 Javascript
JQuery操作元素的css样式
2015/03/09 Javascript
详解javascript函数的参数
2015/11/10 Javascript
如何使用jquery修改css中带有!important的样式属性
2016/04/28 Javascript
JavaScript的字符串方法汇总
2016/07/31 Javascript
jquery datatable服务端分页
2016/08/31 Javascript
jQuery动态生成Bootstrap表格
2016/11/01 Javascript
jQuery实现最简单实用的分秒倒计时
2017/02/05 Javascript
vue实现数据控制视图的原理解析
2020/01/07 Javascript
vue实现微信浏览器左上角返回按钮拦截功能
2020/01/18 Javascript
微信小程序点击view动态添加样式过程解析
2020/01/21 Javascript
vue引用外部JS的两种种方法
2020/01/28 Javascript
如何阻止移动端浏览器点击图片浏览
2020/08/29 Javascript
[01:10]DOTA2次级职业联赛 - EP战队宣传片
2014/12/01 DOTA
[01:14]英雄,所敬略同——2018完美盛典宣传视频4K
2018/12/05 DOTA
Python最长公共子串算法实例
2015/03/07 Python
在Python中画图(基于Jupyter notebook的魔法函数)
2019/10/28 Python
Python如何把Spark数据写入ElasticSearch
2020/04/18 Python
详解Python3 定义一个跨越多行的字符串的多种方法
2020/09/06 Python
AmazeUI 评论列表的实现示例
2020/08/13 HTML / CSS
JPA面试常见问题
2016/11/14 面试题
高中生物教学反思
2014/02/05 职场文书
党的群众路线教育实践活动个人整改方案
2014/10/25 职场文书
2014年镇党建工作汇报材料
2014/11/02 职场文书
求职意向书范本
2015/05/11 职场文书
SQL 聚合、分组和排序
2021/11/11 MySQL