JavaScript数组去重的3种方法和代码实例


Posted in Javascript onJuly 01, 2015

数组去重的方法有很多,到底哪种是最理想的,自己不清楚。于是自己测试了下数组去重的效果和性能。测试十万个数据,代码和所耗大概时间如下。

到底采用哪种方法,根据实际情况而定吧。

/*方法一: 1,'1' 会被认为是相同的; 所有hash对象,如:{x;1},{y:1}会被认为是相同的 //10ms */
Array.prototype.unique=function(){
  var newArr=[],obj={};
  for(var i=0,len=this.length;i<len;i++){
    if(!obj[this[i]]){ 
      newArr.push(this[i]);
      obj[this[i]]=true;
    }
  }
  return newArr;
}

/*方法一改进版:所有hash对象,如:{x;1},{y:1}会被认为是相同的 //30ms*/
Array.prototype.unique=function(){
  var newArr=[],obj={};
  for(var i=0,len=this.length;i<len;i++){
    if(!obj[typeof(this[i])+this[i]]){ 
      newArr.push(this[i]);
      obj[typeof(this[i])+this[i]]=this[i];
    }
  }
  return newArr;
}

/*方法二: 去重结果最好,但耗性能   //250ms*/
Array.prototype.unique=function(){
  var newArr=this.concat();
  for(var i=0,len=newArr.length;i<len;i++) {
    for(var j=i+1,len=newArr.length;j<len;j++) {
      //注意 ===
      if(newArr[i]===newArr[j]) {
        newArr.splice(j,1);
        j--;
      }
    }
  }
  return newArr;
}

/*方法三: 不能去重hash对象 //25ms */
Array.prototype.unique = function(){
  var newArr = []; //一个新的临时数组
  for(var i = 0,len=this.length; i < len; i++){    
    if (newArr.indexOf(this[i]) == -1){  //如果当前数组的第i已经保存进了临时数组,那么跳过,否则把当前项push到临时数组里面
      newArr.push(this[i]);
    }
  }
  return newArr;
}


var arr0=[11,21,221,13,24,"134","1",{x:1,y:1},{name:"pobaby",age:"12",hobby:"football"},{name:"pobaby1",age:"121",hobby:"football1"},{x:134},{y:132},{x:143},{y:3421},"神秘人物", "火柴人技巧格斗", "超音速战场", "小小辛打砖块", "火柴人技巧格斗", "加菲猫超人", "小小辛打砖块", "卑鄙的我2", "电流导线", "飞天手推车","神D秘人物", "火柴人S技巧格斗", "超音SD速战场", "小小SD辛打砖块", "火柴人SD技巧格斗", "加菲S猫超人", "小小DF辛打砖块", "卑鄙的FS我2", "电D流导线", "飞天SD手推车","神秘SD人物", "火柴人技D巧格斗", "超音ASD速战场", "小小辛打SAD砖块", "火柴人技SD巧格斗", "加菲FDS猫超人", "小小辛打SDF砖块", "卑鄙SDF的我2", "电流SDF导线", "飞天手DF推车","神秘SD人物", "火柴人技AS巧格斗", "超音速战FS场", "小小辛SDF打砖块", "火柴人SDF技巧格斗", "加菲SD猫超人",113,231,2221,123,234,"1334","21",{x:13,y:132},{name:"pobaby2",age:"122",hobby:"football2"},{name:"pobaby13",age:"1231",hobby:"football41"},{x:13544},{y:1352},{x:14543},{y:34521},"神秘人sd物", "火柴人技sd巧格斗", "超音速sd战场", "小小辛sd打砖块", "火柴人技巧gw格斗", "加菲猫ui超人", "小小辛yi打砖块", "卑鄙的yi我2", "电流yt导线", "飞天手ytui推车","神Dyu秘人物", "火yui柴人S技yui巧格斗", "超音SDyu速战场", "小小SD辛打砖uyi块", "火柴yui人SD技巧格斗", "加yui菲S猫超人", "小小DF辛打砖ui块", "卑鄙uyi的FS我2", "电D流导yui线", "飞天SD手推uyi车","神i秘SD人物", "火柴人技Dhk巧格斗", "超音ASD速战hk场", "小小辛打SAhkD砖块", "火柴人技SD巧ghk格斗", "加菲FDS猫k超人", "小小辛打SDF砖ytui块", "卑鄙SDF的yui我2", "电流SDyuF导线", "飞天手yuiDF推车","神iy秘SD人hk物", "火柴uyi人技AS巧格hk斗", "超音hg速战FS场", "小小辛SDF打砖hjk块", "火柴人SDF技hj巧格斗", "加菲SDhk猫超人" ];

/*十万个随机数据*/
var arr=[],num;
for(var i = 0; i < 100000; i++){
  num=Math.floor(Math.random()*50);
  arr.push(arr0[num]);
}


var t1= new Date().getTime(); console.log(t1); //开始时间

arr.unique(); //去重

var t2 = new Date().getTime(); console.log(t2); //结束时间

console.log(t2-t1);
Javascript 相关文章推荐
一个简单的javascript类定义例子
Sep 12 Javascript
javascript中的float运算精度实例分析
Aug 21 Javascript
子页向父页传值示例
Nov 27 Javascript
window.location.reload 刷新使用分析(去对话框)
Nov 11 Javascript
学习javascript面向对象 理解javascript原型和原型链
Jan 04 Javascript
微信小程序 页面跳转传参详解
Oct 28 Javascript
关于Function中的bind()示例详解
Dec 02 Javascript
Vue.js 递归组件实现树形菜单(实例分享)
Dec 21 Javascript
jQuery移除或禁用html元素点击事件常用方法小结
Feb 10 Javascript
详解webpack4之splitchunksPlugin代码包分拆
Dec 04 Javascript
Element-ui中元素滚动时el-option超出元素区域的问题
May 30 Javascript
vue中使用router全局守卫实现页面拦截的示例
Oct 23 Javascript
JavaScript检测字符串中是否含有html标签实现方法
Jul 01 #Javascript
JS实现简单的图书馆享元模式实例
Jun 30 #Javascript
JS建造者模式基本用法实例分析
Jun 30 #Javascript
JS模式之简单的订阅者和发布者模式完整实例
Jun 30 #Javascript
JS模式之单例模式基本用法
Jun 30 #Javascript
js简单工厂模式用法实例
Jun 30 #Javascript
JavaScript判断undefined类型的正确方法
Jun 30 #Javascript
You might like
一篇不错的PHP基础学习笔记
2007/03/18 PHP
PHP获取中英混合字符串长度的方法
2014/06/07 PHP
PHP获取网站中各文章的第一张图片的代码示例
2016/05/20 PHP
微信公众号开发之文本消息自动回复php代码
2016/08/08 PHP
PHP PDOStatement::getColumnMeta讲解
2019/02/01 PHP
PHP使用mongoclient简单操作mongodb数据库示例
2019/02/08 PHP
另一个javascript小测验(代码集合)
2011/07/27 Javascript
IE6背景图片不缓存问题解决方案及图片使用策略多个方法小结
2012/05/14 Javascript
js触发onchange事件的方法说明
2014/03/08 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
2015/02/28 Javascript
jQuery实现锚点scoll效果实例分析
2015/03/10 Javascript
JS拖拽插件实现步骤
2015/08/03 Javascript
js实现表单提交后不重新刷新当前页面
2016/11/30 Javascript
vue2.0与bootstrap3实现列表分页效果
2017/11/28 Javascript
vue组件横向树实现代码
2018/08/02 Javascript
vue 音乐App QQ音乐搜索列表最新接口跨域设置方法
2018/09/25 Javascript
jquery获取img的src值实例介绍
2019/01/16 jQuery
vue项目中使用particles实现粒子背景效果及遇到的坑(按钮没有点击响应)
2020/02/11 Javascript
React实现阿里云OSS上传文件的示例
2020/08/10 Javascript
vue cli 3.0通用打包配置代码,不分一二级目录
2020/09/02 Javascript
[49:12]完美世界DOTA2联赛PWL S2 Magma vs GXR 第二场 11.29
2020/12/02 DOTA
在Python中操作文件之seek()方法的使用教程
2015/05/24 Python
使用pandas读取csv文件的指定列方法
2018/04/21 Python
Python拼接微信好友头像大图的实现方法
2018/08/01 Python
Python OpenCV读取png图像转成jpg图像存储的方法
2018/10/28 Python
使用python图形模块turtle库绘制樱花、玫瑰、圣诞树代码实例
2020/03/16 Python
Python 转移文件至云对象存储的方法
2021/02/07 Python
webView加载html图片遇到的问题解决
2019/10/08 HTML / CSS
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
产假请假条
2014/04/10 职场文书
2014年学习部工作总结
2014/11/12 职场文书
2014年酒店工作总结与计划
2014/11/17 职场文书
承德避暑山庄导游词
2015/02/03 职场文书
药品销售内勤岗位职责
2015/04/13 职场文书
2015年妇委会工作总结
2015/05/22 职场文书
2015年幼儿教育工作总结
2015/07/24 职场文书