javascript数组去重常用方法实例分析


Posted in Javascript onApril 11, 2017

本文实例讲述了javascript数组去重常用方法。分享给大家供大家参考,具体如下:

数组去除重复值是面试常考内容,也是很容易用到的一个技巧,下面就几种去重的方法进行介绍。

首先是最常见的方法,也就是添加一个临时数组,将原数组遍历,加入临时数组,每次加入时判断待加入的元素是否存在于临时数组中,代码如下:

// 对数组进行去重操作,只考虑数组中元素为数字或字符串,返回一个去重后的数组
//第一种方法,遍历,将没有的插入临时数组
function uniqArray1(arr) {
  var n=[];
  for(var i=0;i<arr.length;i++){
    //如果当前项已经保存到了临时数组,则跳过,否则加入
    if(n.indexOf(arr[i])==-1){
      n.push(arr[i]);
    }
  }
  return n;
}

那么还有没有更好的办法呢?可以采用哈希表的思想,在JavaScript中,对象的查找比数组下标的查找要快很多倍。所以我们可以创建一个对象专门来存放已加入临时数组的元素,那么每次加入新的元素时就可以通过查找对象来判断是否重复了,代码如下:

//第二种方法,使用哈希表
function uniqArray2(arr){
  var n={},//哈希表
    r=[];//零时数组
  for(var i=0;i<arr.length;i++){
    if(n[arr[i]]==null){//如果哈希表中没有,则添加到哈希表,且进入临时数组
      n[arr[i]]=true;
      r.push(arr[i]);
    }
  }
  return r;
}

还有一种方法,虽然速度没有哈希表快,但是比最基本的indexOf来的快,思想就是先经过排序函数sort,再比较相邻的元素,不同的就加到临时数组中。代码如下:

//第三种方法,先排序,再比较邻接部分
function uniqArray3(arr){
  arr.sort();
  var r=[arr[0]];
  for(var i=1;i<arr.length;i++){
    if(arr[i]!=r[r.length-1]){//由于已经经过了排序,所以相邻的是相同的
      r.push(arr[i]);
    }
  }
  return r;
}

最后实验代码如下:

//验证数组去重函数的使用
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++){//为了分辨出花费时间的区别,特此增加数组的长度
  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,说明对象下标的引用要比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快,但是没有哈希快

可以看到哈希算法的速度是最快的。

Javascript 相关文章推荐
从盛大通行证上摘下来的身份证验证js代码
Jan 11 Javascript
web前端设计师们常用的jQuery特效插件汇总
Dec 07 Javascript
JavaScript中的类与实例实现方法
Jan 23 Javascript
JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果
Nov 26 Javascript
纯js代码实现简单计算器
Dec 02 Javascript
Node.js重新刷新session过期时间的方法
Feb 04 Javascript
Bootstrap每天必学之滚动监听
Mar 16 Javascript
JS使用单链表统计英语单词出现次数
Jun 16 Javascript
vue.js之vue-cli脚手架的搭建详解
May 05 Javascript
微信小程序结合mock.js实现后台模拟及调试
Mar 28 Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 Javascript
vue配置型表格基于el-table拓展之table-plus组件
Apr 12 Vue.js
JS实现针对给定时间的倒计时功能示例
Apr 11 #Javascript
vuejs绑定class和style样式
Apr 11 #Javascript
vue监听滚动事件实现滚动监听
Apr 11 #Javascript
jQuery插件FusionCharts绘制的2D双面积图效果示例【附demo源码】
Apr 11 #jQuery
jQuery EasyUI 组件加上“清除”功能实例详解
Apr 11 #jQuery
JS中IP地址与整数相互转换的实现代码
Apr 10 #Javascript
详解vue组件化开发-vuex状态管理库
Apr 10 #Javascript
You might like
利用PHP命令行模式采集股票趋势信息
2016/08/09 PHP
php微信公众平台开发之微信群发信息
2016/09/13 PHP
Python中使用django form表单验证的方法
2017/01/16 PHP
jQuery Ajax之load()方法
2009/10/12 Javascript
JavaScript Cookie 直接浏览网站分网址
2009/12/08 Javascript
JavaScript操作Cookie方法实例分析
2015/05/27 Javascript
Javascript实现鼠标右键特色菜单
2015/08/04 Javascript
jQuery与getJson结合的用法实例
2015/08/07 Javascript
JavaScript 七大技巧(二)
2015/12/13 Javascript
JavaScript实现自动切换图片代码
2016/10/11 Javascript
详解Javascript中的原型OOP
2016/10/12 Javascript
jQuery简易时光轴实现方法示例
2017/03/13 Javascript
AngularJS中$http的交互问题
2017/03/29 Javascript
jquery.masonry瀑布流效果
2017/05/25 jQuery
jQuery幻灯片插件owlcarousel参数说明中文文档
2018/02/27 jQuery
基于Vue中点击组件外关闭组件的实现方法
2018/03/06 Javascript
JS实现select选中option触发事件操作示例
2018/07/13 Javascript
详解JavaScript数据类型和判断方法
2020/09/04 Javascript
javascript实现倒计时关闭广告
2021/02/09 Javascript
[01:01:35]Optic vs paiN 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python中requests爬去网页内容出现乱码问题解决方法介绍
2017/10/25 Python
使用GitHub和Python实现持续部署的方法
2019/05/09 Python
PyQt5中多线程模块QThread使用方法的实现
2020/01/31 Python
python实现俄罗斯方块游戏(改进版)
2020/03/13 Python
浅谈python锁与死锁问题
2020/08/14 Python
2014年圣诞节倒计时网页的制作过程
2014/12/05 HTML / CSS
党员培训思想汇报
2014/01/07 职场文书
运动会加油口号
2014/06/07 职场文书
搞笑车尾标语
2014/06/23 职场文书
社区两委对照检查材料
2014/08/23 职场文书
追悼会家属答谢词
2015/09/29 职场文书
2016年政治理论学习心得体会
2016/01/25 职场文书
《检阅》教学反思
2016/02/22 职场文书
《陶罐和铁罐》教学反思
2016/03/03 职场文书
CKAD认证中部署k8s并配置Calico插件
2022/03/31 Servers
引用计数法和root搜索算法以及JVM中判定对象需要回收的方法
2022/04/19 Java/Android