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 相关文章推荐
一览画面点击复选框后获取多个id值的方法
May 30 Javascript
解析JavaScript中的字符串类型与字符编码支持
Jun 24 Javascript
微信小程序 Flex布局详解
Oct 09 Javascript
js中class的点击事件没有效果的解决方法
Oct 13 Javascript
AngularJS入门教程之MVC架构实例分析
Nov 01 Javascript
一步步教你利用Canvas对图片进行处理
Sep 19 Javascript
JavaScript异步加载问题总结
Feb 17 Javascript
vue+element-ui动态生成多级表头的方法
Aug 28 Javascript
react脚手架如何配置less和ant按需加载的方法步骤
Nov 28 Javascript
vue实现日历备忘录功能
Sep 24 Javascript
解决vue项目 build之后资源文件找不到的问题
Sep 12 Javascript
ant design的table组件实现全选功能以及自定义分页
Nov 17 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
PHP编译安装时常见错误解决办法
2015/05/28 PHP
php+redis消息队列实现抢购功能
2018/02/08 PHP
php读取本地json文件的实例
2018/03/07 PHP
wordpress自定义标签云与随机获取标签的方法详解
2019/03/22 PHP
类似框架的js代码
2006/11/09 Javascript
JScript中的undefined和&quot;undefined&quot;的区别
2007/03/08 Javascript
使用jquery给input和textarea设定ie中的focus
2008/05/29 Javascript
javascript 函数使用说明
2010/04/07 Javascript
JS获取地址栏参数的小例子
2013/08/23 Javascript
jquery改变disabled的boolean状态的三种方法
2013/12/13 Javascript
JS+CSS实现经典的左侧竖向滑动菜单效果
2015/09/23 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
js转换对象为xml
2017/02/17 Javascript
详解Angular路由 ng-route和ui-router的区别
2017/05/22 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
2018/04/13 Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
2018/11/14 Javascript
layDate日期控件使用方法详解
2018/11/15 Javascript
antd组件Upload实现自己上传的实现示例
2018/12/18 Javascript
关于layui 下拉列表的change事件详解
2019/09/20 Javascript
js实现图片跟随鼠标移动效果
2019/10/16 Javascript
写给新手同学的vuex快速上手指北小结
2020/04/14 Javascript
解决Can't find variable: SockJS vue项目的问题
2020/09/22 Javascript
[47:21]Liquid vs TNC Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
基于python实现微信模板消息
2015/12/21 Python
Python设计模式之抽象工厂模式原理与用法详解
2019/01/15 Python
关于python3中setup.py小概念解析
2019/08/22 Python
科颜氏加拿大官方网站: Kiehl’s加拿大
2016/08/16 全球购物
ECCO英国官网:丹麦鞋履品牌
2019/09/03 全球购物
请用用Java代码写一个堆栈
2012/01/26 面试题
妈妈活动方案
2014/08/15 职场文书
关于青春的演讲稿500字
2014/08/22 职场文书
2014年六五普法工作总结
2014/11/25 职场文书
刘公岛导游词
2015/02/05 职场文书
2015年客房服务员工作总结
2015/05/15 职场文书
老人节主持词
2015/07/04 职场文书
MySQL中正则表达式(REGEXP)使用详解
2022/07/07 MySQL