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 相关文章推荐
文本加密解密
Jun 23 Javascript
Knockoutjs快速入门(经典)
Dec 24 Javascript
JavaScript中prototype为对象添加属性的误区介绍
Oct 15 Javascript
Js判断参数(String,Array,Object)是否为undefined或者值为空
Nov 04 Javascript
JS根据变量保存方法名并执行方法示例
Apr 04 Javascript
jQuery中的通配符选择器使用总结
May 30 Javascript
js判断浏览器是否支持严格模式的方法
Oct 04 Javascript
微信小程序开发之map地图实现教程
Jun 08 Javascript
jQuery扇形定时器插件pietimer使用方法详解
Jul 18 jQuery
微信小程序如何获取用户头像和昵称
Sep 23 Javascript
云服务器部署Node.js项目的方法步骤(小白系列)
Mar 23 Javascript
vue中实现点击变成全屏的多种方法
Sep 27 Javascript
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
弄了个检测传输的参数是否为数字的Function
2006/12/06 PHP
PHP中将数组转成XML格式的实现代码
2011/08/08 PHP
PHP定时执行计划任务的多种方法小结
2011/12/19 PHP
ThinkPHP权限认证Auth实例详解
2014/07/22 PHP
php实现的一段简单概率相关代码
2016/05/30 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
PHP实现的注册,登录及查询用户资料功能API接口示例
2017/06/06 PHP
最新的10款jQuery内容滑块插件分享
2011/09/18 Javascript
js实现的全国省市二级联动下拉选择菜单完整实例
2015/08/17 Javascript
jquery性能优化高级技巧
2015/08/24 Javascript
js实现跨域的4种实用方法原理分析
2015/10/29 Javascript
jQuery中事件与动画的总结分享
2016/05/24 Javascript
jquery实现下拉框多选方法介绍
2017/01/03 Javascript
Bootstrap缩略图与警告框学习使用
2017/02/08 Javascript
angularjs实现下拉列表的选中事件示例
2017/03/03 Javascript
pycharm 使用心得(七)一些实用功能介绍
2014/06/06 Python
Python格式化输出%s和%d
2018/05/07 Python
python3 对list中每个元素进行处理的方法
2018/06/29 Python
Python实现点阵字体读取与转换的方法
2019/01/29 Python
python 使用socket传输图片视频等文件的实现方式
2019/08/07 Python
Python 使用多属性来进行排序
2019/09/01 Python
使用Python为中秋节绘制一块美味的月饼
2019/09/11 Python
Python3.7在anaconda里面使用IDLE编译器的步骤详解
2020/04/29 Python
Python之字典添加元素的几种方法
2020/09/30 Python
python 利用Pyinstaller打包Web项目
2020/10/23 Python
Python+Opencv实现把图片、视频互转的示例
2020/12/17 Python
REN Clean Skincare官网:英国本土有机护肤品牌
2019/02/23 全球购物
Java程序开发中如何应用线程
2016/03/03 面试题
幼儿园儿童节主持词
2014/03/21 职场文书
保密协议书范本
2014/04/22 职场文书
招标承诺书
2014/08/30 职场文书
教师三严三实心得体会
2014/10/11 职场文书
保证金退回承诺函格式
2015/01/21 职场文书
办公室文员岗位职责
2015/02/04 职场文书
Python激活Anaconda环境变量的详细步骤
2021/06/08 Python
在Docker容器中部署SQL Server
2022/04/11 Servers