JavaScript实现删除数组重复元素的5种常用高效算法总结


Posted in Javascript onJanuary 18, 2018

本文实例讲述了JavaScript实现删除数组重复元素的5种常用高效算法。分享给大家供大家参考,具体如下:

这里就 js 如何实现数组去重整理出5种方法,并附上演示Demo 以及 源码。

1.遍历数组法

最简单的去重方法,

实现思路:新建一新数组,遍历传入数组,值不在新数组就加入该新数组中;注意点:判断值是否在数组的方法“indexOf”是ECMAScript5 方法,IE8以下不支持,需多写一些兼容低版本浏览器代码,源码如下:

// 最简单数组去重法
function unique1(array){
 var n = []; //一个新的临时数组
 //遍历当前数组
 for(var i = 0; i < array.length; i++){
  //如果当前数组的第i已经保存进了临时数组,那么跳过,
  //否则把当前项push到临时数组里面
  if (n.indexOf(array[i]) == -1) n.push(array[i]);
 }
 return n;
}
// 判断浏览器是否支持indexOf ,indexOf 为ecmaScript5新方法 IE8以下(包括IE8, IE8只支持部分ecma5)不支持
if (!Array.prototype.indexOf){
 // 新增indexOf方法
 Array.prototype.indexOf = function(item){
  var result = -1, a_item = null;
  if (this.length == 0){
   return result;
  }
  for(var i = 0, len = this.length; i < len; i++){
   a_item = this[i];
   if (a_item === item){
    result = i;
    break;
   } 
  }
  return result;
 }
}

2.对象键值对法

该方法执行的速度比其他任何方法都快, 就是占用的内存大一些;

实现思路:新建一js对象以及新数组,遍历传入数组时,判断值是否为js对象的键,不是的话给对象新增该键并放入新数组。注意点: 判断是否为js对象键时,会自动对传入的键执行“toString()”,不同的键可能会被误认为一样;例如: a[1]、a["1"] 。解决上述问题还是得调用“indexOf”。

// 速度最快, 占空间最多(空间换时间)
function unique2(array){
 var n = {}, r = [], len = array.length, val, type;
  for (var i = 0; i < array.length; i++) {
    val = array[i];
    type = typeof val;
    if (!n[val]) {
      n[val] = [type];
      r.push(val);
    } else if (n[val].indexOf(type) < 0) {
      n[val].push(type);
      r.push(val);
    }
  }
  return r;
}

3.数组下标判断法

还是得调用“indexOf”性能跟方法1差不多,

实现思路:如果当前数组的第i项在当前数组中第一次出现的位置不是i,那么表示第i项是重复的,忽略掉。否则存入结果数组。

function unique3(array){
 var n = [array[0]]; //结果数组
 //从第二项开始遍历
 for(var i = 1; i < array.length; i++) {
  //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
  //那么表示第i项是重复的,忽略掉。否则存入结果数组
  if (array.indexOf(array[i]) == i) n.push(array[i]);
 }
 return n;
}

4.排序后相邻去除法

虽然原生数组的”sort”方法排序结果不怎么靠谱,但在不注重顺序的去重里该缺点毫无影响。

实现思路:给传入数组排序,排序后相同值相邻,然后遍历时新数组只加入不与前一值重复的值。

// 将相同的值相邻,然后遍历去除重复值
function unique4(array){
 array.sort(); 
 var re=[array[0]];
 for(var i = 1; i < array.length; i++){
  if( array[i] !== re[re.length-1])
  {
   re.push(array[i]);
  }
 }
 return re;
}

5.优化遍历数组法

源自外国博文,该方法的实现代码相当酷炫;

实现思路:获取没重复的最右一值放入新数组。(检测到有重复值时终止当前循环同时进入顶层循环的下一轮判断)

// 思路:获取没重复的最右一值放入新数组
function unique5(array){
 var r = [];
 for(var i = 0, l = array.length; i < l; i++) {
  for(var j = i + 1; j < l; j++)
   if (array[i] === array[j]) j = ++i;
  r.push(array[i]);
 }
 return r;
}

github项目源码:https://github.com/wteam-xq/testDemo/blob/master/array.html

Javascript 相关文章推荐
CSS常用网站布局实例
Apr 03 Javascript
url 特殊字符 传递参数解决方法
Jan 01 Javascript
jQuery实现类似淘宝购物车全选状态示例
Jun 26 Javascript
jquery用get实现ajax在ie里面刷新不进入后台解决方法
Aug 12 Javascript
用jQuery模拟select下拉框的简单示例代码
Jan 26 Javascript
浅析jQuery事件之on()方法绑定多个选择器,多个事件
Apr 27 Javascript
jQuery图片轮播插件——前端开发必看
May 31 Javascript
为你的微信小程序体积瘦身详解
May 20 Javascript
webpack学习教程之publicPath路径问题详解
Jun 17 Javascript
Vue侧滑菜单组件——DrawerLayout
Dec 18 Javascript
在ES5与ES6环境下处理函数默认参数的实现方法
May 13 Javascript
Vue看了就会的8个小技巧
Jan 21 Vue.js
react-router4 配合webpack require.ensure 实现异步加载的示例
Jan 18 #Javascript
分享ES6的7个实用技巧
Jan 18 #Javascript
vue 动态修改a标签的样式的方法
Jan 18 #Javascript
详解vue-meta如何让你更优雅的管理头部标签
Jan 18 #Javascript
Nuxt.js踩坑总结分享
Jan 18 #Javascript
Nuxt.js实战详解
Jan 18 #Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
Jan 18 #Javascript
You might like
推荐文章系统(一)
2006/10/09 PHP
初学PHP的朋友 经常问的一些问题。不断更新
2011/08/11 PHP
php在window iis的莫名问题的测试方法
2013/05/14 PHP
Swoole扩展的6种模式深入详解
2021/03/04 PHP
用js实现控制内容的向上向下滚动效果
2007/06/26 Javascript
Tab页界面,用jQuery及Ajax技术实现
2009/09/21 Javascript
js内存泄露的几种情况详细探讨
2013/05/31 Javascript
js判断undefined变量类型使用typeof
2013/06/03 Javascript
简单的代码实现jquery定时器
2013/11/17 Javascript
jquery实现在页面加载完毕后获取图片高度或宽度
2014/06/16 Javascript
JavaScript实现非常简单实用的下拉菜单效果
2015/08/27 Javascript
js创建数组的简单方法
2016/07/27 Javascript
jQuery Ajax 异步加载显示等待效果代码分享
2016/08/01 Javascript
关于JavaScript中forEach和each用法浅析
2017/07/27 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
微信小程序自定义模态对话框实例详解
2017/08/16 Javascript
使用vscode快速建立vue模板过程详解
2019/10/10 Javascript
js实现选项卡效果
2020/03/07 Javascript
vue 解决uglifyjs-webpack-plugin打包出现报错的问题
2020/08/04 Javascript
[46:47]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS NE
2014/05/22 DOTA
[01:24]DOTA2上海特锦赛OG战队抵达 专车接机入驻总统套房
2016/02/23 DOTA
Python随机生成均匀分布在单位圆内的点代码示例
2017/11/13 Python
Python button选取本地图片并显示的实例
2019/06/13 Python
在PyTorch中Tensor的查找和筛选例子
2019/08/18 Python
Python logging模块异步线程写日志实现过程解析
2020/06/30 Python
对python中list的五种查找方法说明
2020/07/13 Python
Python绘制组合图的示例
2020/09/18 Python
英国标准协会商店:BSI Shop
2019/02/25 全球购物
美国踏板车和轻便摩托车销售网站:Mega Motor Madness
2020/02/26 全球购物
公司清洁工岗位职责
2013/12/14 职场文书
应届行政管理专业个人自我评价
2013/12/28 职场文书
难忘的一课教学反思
2014/04/30 职场文书
优秀学生党员先进事迹材料
2014/05/29 职场文书
员工福利申请报告
2015/05/15 职场文书
四大名著读书笔记
2015/06/25 职场文书
2015年教务处干事工作总结
2015/07/22 职场文书