JavaScript数组去重算法实例小结


Posted in Javascript onMay 07, 2018

本文实例总结了JavaScript数组去重算法。分享给大家供大家参考,具体如下:

测试用例:

arr = ["1",3,"1",1,4,5,1,"2",5,1,{"name":"li","age":20},2,4,3,{"name":"li","age":20},""];

方法一:借助于临时数组与indexOf , 算法复杂度为:O(n^2)

function unique1(arr){
  var temp = [];
  for(var i=0; i<arr.length; i++){
    if(temp.indexOf(arr[i]) == -1){
      temp.push(arr[i]);
    }
  }
  return temp;
}

测试结果:

unique1(arr) : ["1", 3, 1, 4, 5, "2", Object { name="li", age=20}, 2, Object { name="li", age=20}, ""]

bug 无法区分对象

方法二 : 用JavaScript中的Object对象来当作哈希表

function unique2(arr){
  var temp=[];
  var hash={};
  for(var i=0; i<arr.length;i++){
    if(!hash[arr[i]]){
      hash[arr[i]]=true;
      temp.push(arr[i]);
    }
  }
  return temp;
}

测试结果:

unique2(arr) : ["1", 3, 4, 5, "2", Object { name="li", age=20}, ""]

bug : 无法区分: 1 和 "1"

修改

function unique2(arr){
  var temp=[];
  var hash={};
  for(var i=0; i<arr.length;i++){
      var item = arr[i];
    var key = typeof(item)+item;
    if(!hash[key]){
      hash[key]=true;
      temp.push(arr[i]);
    }
  }
  return temp;
}

测试结果:

unique2(arr) : ["1", 3, 1, 4, 5, "2", Object { name="li", age=20}, 2, ""]

方法三:先用sort对数组排序,然后借助临时数组,存储相同元素的最后一个,该方法只能用于纯Number类型数组

function unique3(arr){
  arr.sort(function(a,b){
    return a-b;
  });
  var temp = [];
  for(var i=0;i<arr.length;i++){
    if(arr[i] !== arr[i+1]){
      temp.push(arr[i]);
    }
  }
  return temp;
}
Javascript 相关文章推荐
远离JS灾难css灾难之 js私有函数和css选择器作为容器
Dec 11 Javascript
JavaScript 验证码的实例代码(附效果图)
Mar 22 Javascript
jquery+css3打造一款ajax分页插件(自写)
Jun 18 Javascript
JS获取表格内指定单元格html内容的方法
Mar 31 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 Javascript
详解iframe与frame的区别
Jan 13 Javascript
javascript数组对象常用api函数小结(连接,插入,删除,反转,排序等)
Sep 20 Javascript
详解vue项目中调用百度地图API使用方法
Apr 25 Javascript
vue-cli配置flexible过程详解
Jul 04 Javascript
JS实现网页烟花动画效果
Mar 10 Javascript
vant中的toast层级改变操作
Nov 04 Javascript
JS指定音频audio在某个时间点进行播放
Nov 28 Javascript
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
May 07 #Javascript
详解VUE-地区选择器(V-Distpicker)组件使用心得
May 07 #Javascript
JavaScript实现的DOM树遍历方法详解【二叉DOM树、多叉DOM树】
May 07 #Javascript
Vue 实现树形视图数据功能
May 07 #Javascript
JavaScript 跨域之POST实现方法
May 07 #Javascript
ES6关于Promise的用法详解
May 07 #Javascript
React Form组件的实现封装杂谈
May 07 #Javascript
You might like
使用Apache的htaccess防止图片被盗链的解决方法
2013/04/27 PHP
PHP使用NuSOAP调用Web服务的方法
2015/07/18 PHP
thinkPHP简单导入和使用阿里云OSSsdk的方法
2017/03/15 PHP
php 判断页面或图片是否经过gzip压缩的方法
2017/04/05 PHP
Laravel访问出错提示:`Warning: require(/vendor/autoload.php): failed to open stream: No such file or di解决方法
2019/04/02 PHP
php如何获取Http请求
2020/04/30 PHP
utf8的编码算法 转载
2006/12/27 Javascript
GreyBox技术总结(转)
2010/11/23 Javascript
JS获取后台Cookies值的小例子
2013/03/04 Javascript
jquery获取radio值实例
2014/10/16 Javascript
angularJS提交表单(form)
2015/02/09 Javascript
jQuery制作仿Mac Lion OS滚动条效果
2015/02/10 Javascript
javascript实现超炫的向上滑行菜单实例
2015/08/03 Javascript
css如何让浮动元素水平居中
2015/08/07 Javascript
详解js中Json的语法与格式
2016/11/22 Javascript
常见的浏览器Hack技巧整理
2017/06/29 Javascript
详谈表单重复提交的三种情况及解决方法
2017/08/16 Javascript
React教程之Props验证的具体用法(Props Validation)
2017/09/04 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
D3.js(v3)+react 实现带坐标与比例尺的散点图 (V3版本)
2019/05/09 Javascript
Jquery属性的获取/设置及样式添加/删除操作技巧分析
2019/12/23 jQuery
手把手教你实现 Promise的使用方法
2020/09/02 Javascript
浅析JavaScript 函数柯里化
2020/09/08 Javascript
vue 二维码长按保存和复制内容操作
2020/09/22 Javascript
python虚拟环境virualenv的安装与使用
2016/12/18 Python
matplotlib在python上绘制3D散点图实例详解
2017/12/09 Python
Python中的 enum 模块源码详析
2019/01/09 Python
Python一个简单的通信程序(客户端 服务器)
2019/03/06 Python
解决Djang2.0.1中的reverse导入失败的问题
2019/08/16 Python
Python tkinter之ComboBox(下拉框)的使用简介
2021/02/05 Python
平面设计师工作职责范文
2013/12/03 职场文书
幼儿园教师教学反思
2014/02/06 职场文书
小学生作文评语
2014/04/18 职场文书
党的群众路线教育实践活动对照检查材料(教师)
2014/09/24 职场文书
土建施工员岗位职责
2015/04/11 职场文书
python图片灰度化处理的几种方法
2021/06/23 Python