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 相关文章推荐
JavaScript动态插入script的基本思路及实现函数
Nov 11 Javascript
JS替换文本域内的回车示例
Feb 18 Javascript
js闭包的用途详解
Nov 09 Javascript
浅谈javascript的分号的使用
May 12 Javascript
AngularJs Scope详解及示例代码
Sep 01 Javascript
JS锚点的设置与使用方法
Sep 05 Javascript
AngularJS实现动态添加Option的方法
May 17 Javascript
详解webpack分离css单独打包
Jun 21 Javascript
angular+ionic返回上一页并刷新页面
Aug 08 Javascript
Vue组件选项props实例详解
Aug 18 Javascript
提升node.js中使用redis的性能遇到的问题及解决方法
Oct 30 Javascript
微信小程序自定义弹窗滚动与页面滚动冲突的解决方法
Jul 16 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
PHP 分页类(模仿google)-面试题目解答
2009/09/13 PHP
PHP jQuery表单,带验证具体实现方法
2014/02/15 PHP
JavaScript 以对象为索引的关联数组
2010/05/19 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
2013/01/27 Javascript
关于jquery css的使用介绍
2013/04/18 Javascript
jQuery 获取/设置/删除DOM元素的属性以a元素为例
2014/05/23 Javascript
js交换排序 冒泡排序算法(Javascript版)
2014/10/04 Javascript
超炫的jquery仿flash导航栏特效
2014/11/11 Javascript
jQuery增加与删除table列的方法
2016/03/01 Javascript
浅析Vue 和微信小程序的区别、比较
2018/08/03 Javascript
vue 使某个组件不被 keep-alive 缓存的方法
2018/09/21 Javascript
vue.config.js中配置Vue的路径别名的方法
2020/02/11 Javascript
vue实现数字滚动效果
2020/06/29 Javascript
基于循环神经网络(RNN)的古诗生成器
2018/03/26 Python
python放大图片和画方格实现算法
2018/03/30 Python
pygame实现雷电游戏雏形开发
2018/11/20 Python
Python中查看变量的类型内存地址所占字节的大小
2019/06/26 Python
程序员的七夕用30行代码让Python化身表白神器
2019/08/07 Python
python实现猜数字游戏
2020/03/25 Python
PyCharm 2019.3发布增加了新功能一览
2019/12/08 Python
pycharm通过ssh连接远程服务器教程
2020/02/12 Python
Python学习之路安装pycharm的教程详解
2020/06/17 Python
python链表类中获取元素实例方法
2021/02/23 Python
Python制作运行进度条的实现效果(代码运行不无聊)
2021/02/24 Python
Carmen Sol官网:购买果冻鞋、手袋和配件
2021/01/01 全球购物
简述安装Slackware Linux系统的过程
2012/01/12 面试题
财务经理岗位职责
2013/11/09 职场文书
某同学的自我鉴定范文
2013/12/26 职场文书
司马光教学反思
2014/02/01 职场文书
2014大学生中国梦主题教育学习思想汇报
2014/09/10 职场文书
执法作风整顿剖析材料
2014/10/11 职场文书
群众路线教育实践活动总结
2014/10/30 职场文书
投标承诺函格式
2015/01/21 职场文书
小学运动会开幕词
2015/01/28 职场文书
前台岗位职责范本
2015/04/16 职场文书
pandas 实现将NaN转换为None
2021/05/14 Python