javascript数组去重方法汇总


Posted in Javascript onApril 23, 2015

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;
};
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;
};
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;
};
var arr = [1,2,2,2,3,3,4,5];
console.log(arr.unique1()); // [1, 2, 3, 4, 5]
console.log(arr.unique2()); // [1, 2, 3, 4, 5]
console.log(arr.unique3()); // [1, 2, 3, 4, 5]
console.log(arr.unique4()); // [1, 2, 3, 4, 5]

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

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

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
javascript getElementsByClassName函数
Apr 01 Javascript
JQuery显示隐藏页面元素的方法总结
Apr 16 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
图解Sublime Text3使用技巧
Dec 21 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
May 17 Javascript
vue-router 中router-view不能渲染的解决方法
May 23 Javascript
深入理解Vue 单向数据流的原理
Nov 09 Javascript
微信小程序生成分享海报方法(附带二维码生成)
Mar 29 Javascript
layui之table checkbox初始化时选中对应选项的方法
Sep 02 Javascript
vuex 实现getter值赋值给vue组件里的data示例
Nov 05 Javascript
JS如何使用剪贴板操作Clipboard API
May 17 Javascript
javascript实现英文首字母大写
Apr 23 #Javascript
原生js和jquery实现图片轮播淡入淡出效果
Apr 23 #Javascript
浅谈javascript中for in 和 for each in的区别
Apr 23 #Javascript
原生js和jquery实现图片轮播特效
Apr 23 #Javascript
使用纯javascript实现经典扫雷游戏
Apr 23 #Javascript
jQuery图片特效插件Revealing实现拉伸放大
Apr 22 #Javascript
jQuery插件jcrop+Fileapi完美实现图片上传+裁剪+预览的代码分享
Apr 22 #Javascript
You might like
全国FM电台频率大全 - 26 西藏自治区
2020/03/11 无线电
学习php设计模式 php实现享元模式(flyweight)
2015/12/07 PHP
PHP微信开发之查询微信精选文章
2016/06/23 PHP
PHPCrawl爬虫库实现抓取酷狗歌单的方法示例
2017/12/21 PHP
基于jQuery实现网页打印功能
2015/12/01 Javascript
前端弹出对话框 js实现ajax交互
2016/09/09 Javascript
AngularJS实现根据不同条件显示不同控件
2017/04/20 Javascript
深入浅出webpack教程系列_安装与基本打包用法和命令参数详解
2017/09/10 Javascript
js实现轮播图的两种方式(构造函数、面向对象)
2017/09/30 Javascript
微信小程序使用audio组件播放音乐功能示例【附源码下载】
2017/12/08 Javascript
JS数组去重常用方法实例小结【4种方法】
2018/05/28 Javascript
详解vue.js下引入百度地图jsApi的两种方法
2018/07/27 Javascript
vue.js+ElementUI实现进度条提示密码强度效果
2020/01/18 Javascript
微信小程序修改checkbox的样式代码实例
2020/01/21 Javascript
Element InfiniteScroll无限滚动的具体使用方法
2020/07/27 Javascript
[01:07]2015国际邀请赛 中国区预选赛精彩回顾
2015/06/15 DOTA
python正则表达式抓取成语网站
2013/11/20 Python
python模拟登陆Tom邮箱示例分享
2014/01/13 Python
Python实现屏幕截图的代码及函数详解
2016/10/01 Python
Python实现动态添加属性和方法操作示例
2018/07/25 Python
Python初学者需要注意的事项小结(python2与python3)
2018/09/26 Python
python爬取淘宝商品销量信息
2018/11/16 Python
Python实现的ftp服务器功能详解【附源码下载】
2019/06/26 Python
如何利用Python给自己的头像加一个小国旗(小月饼)
2020/10/02 Python
Europcar澳大利亚官网:全球汽车租赁领域的领导者
2019/03/24 全球购物
大学生求职自荐信
2013/12/12 职场文书
临床医师专业个人自我评价
2014/01/08 职场文书
2014年上半年工作自我评价
2014/01/18 职场文书
市场策划求职信
2014/08/07 职场文书
北京英文导游词
2015/02/12 职场文书
小学数学教师研修感悟
2015/11/18 职场文书
2016年度农村党员干部主题教育活动总结
2016/04/06 职场文书
幼儿教师三分钟演讲稿
2019/06/21 职场文书
CSS3实现模糊背景的三种效果示例
2021/03/30 HTML / CSS
html5实现点击弹出图片功能
2021/07/16 HTML / CSS
JS前端轻量fabric.js系列物体基类
2022/08/05 Javascript