js数组去重的方法汇总


Posted in Javascript onJuly 29, 2015

三种方法

利用indexOf判断新数组

underscore.js中实际上也是使用的类似的indexOf

//传入数组
 function unique1(arr){
  var tmpArr = [];
  for(var i=0; i<arr.length; i++){
   //如果当前数组的第i已经保存进了临时数组,那么跳过,
   //否则把当前项push到临时数组里面
   if(tmpArr.indexOf(arr[i]) == -1){
    tmpArr.push(arr[i]);
   }
  }
  return tmpArr;
 }

利用indexOf判断旧数组

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

利用hash查找

这里利用了JS对象的实现就是hash表的特性

function unique3(arr){
  var tmpArr = [], hash = {};//hash为hash表
  for(var i=0;i<arr.length;i++){
   if(!hash[arr[i]]){//如果hash表中没有当前项
    hash[arr[i]] = true;//存入hash表
    tmpArr.push(arr[i]);//存入临时数组
   }
  }
  return tmpArr;
 }

数组扩展

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

 Array.prototype.unique2 = function(){
   var tmpArr = []; //结果数组
   for(var i = 0; i < this.length; i++){
    if (this.indexOf(this[i]) == i){
     tmpArr.push(this[i]);
    }
   }
   return tmpArr;
 }

 Array.prototype.unique3 = function(){
   var tmpArr=[], hash = {};
   for(var i = 0; i < this.length; i++){
    if (!hash[this[i]]){
      hash[this[i]] = true; 
      tmpArr.push(this[i]); 
    }
   }
   return tmpArr;
 }

使用Set

Set和Map是ES6中新增的数据结构
Set直接可以存储不重复的一组key,这个key也可以是对象,字符串等
创建set

var s = new Set([1, 2, 3,]);
s; // Set {1, 2, 3}

新增元素

>>> s.add(4)
>>> s
{1, 2, 3, 4}
>>> s.add(4)
>>> s
{1, 2, 3, 4}//重复元素不会被添加

删除元素

s; // Set {1, 2, 3, 4}
s.delete(3);
s; // Set {1, 2, 4}

遍历元素

Map和Set无法使用下标
ES6标准引入了新的iterable类型,Array、Map和Set都属于iterable类型

var s = new Set(['A', 'B', 'C']);

for (var x of s) { // 遍历Set
  alert(x);
}

或者直接使用iterable内置的forEach方法
forEach方法是ES5.1标准引入的

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, set) {
  alert(element);
});

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

Javascript 相关文章推荐
Add Formatted Data to a Spreadsheet
Jun 12 Javascript
javascript仿qq界面的折叠菜单实现代码
Dec 12 Javascript
禁用JavaScript控制台调试的方法
Mar 07 Javascript
angularjs基础教程
Dec 25 Javascript
Jquery注册事件实现方法
May 18 Javascript
JS使用eval()动态创建变量的方法
Jun 03 Javascript
jQuery实现的表格展开伸缩效果实例
Sep 07 Javascript
localStorage实现便签小程序
Nov 28 Javascript
javascript判断回文数详解及实现代码
Feb 03 Javascript
jQuery插件HighCharts实现的2D条状图效果示例【附demo源码下载】
Mar 15 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
Jan 31 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
Jul 29 #Javascript
JavaScript中的cacheStorage使用详解
Jul 29 #Javascript
JavaScript中数组继承的简单示例
Jul 29 #Javascript
小议JavaScript中Generator和Iterator的使用
Jul 29 #Javascript
浅析Node.js的Stream模块中的Readable对象
Jul 29 #Javascript
浅谈Javascript数组的使用
Jul 29 #Javascript
举例讲解Node.js中的Writable对象
Jul 29 #Javascript
You might like
php设计模式之策略模式实例分析【星际争霸游戏案例】
2020/03/26 PHP
NodeJs中的非阻塞方法介绍
2012/06/05 NodeJs
在jQuery ajax中按钮button和submit的区别分析
2012/10/07 Javascript
简单js代码实现selece二级联动(推荐)
2014/02/18 Javascript
js函数参数设置默认值的一种变通实现方法
2014/05/26 Javascript
js使用栈来实现10进制转8进制与取除数及余数
2014/06/11 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
Javascript动态创建div的方法
2015/02/09 Javascript
jQuery检测输入的字符串包含的中英文的数量
2015/04/17 Javascript
JavaScript实现模仿桌面窗口的方法
2015/07/18 Javascript
老生常谈js中的MVC
2017/07/25 Javascript
本地存储localStorage用法详解
2017/07/31 Javascript
Vue实现固定定位图标滑动隐藏效果
2019/05/30 Javascript
vue 获取视频时长的实例代码
2019/08/20 Javascript
微信sdk实现禁止微信分享(使用原生php实现)
2019/11/15 Javascript
[02:40]2018年度DOTA2最佳新人-完美盛典
2018/12/16 DOTA
[43:53]OG vs EG 2019国际邀请赛淘汰赛 胜者组 BO3 第三场 8.22
2019/09/05 DOTA
python使用reportlab画图示例(含中文汉字)
2013/12/03 Python
Python基础语法(Python基础知识点)
2016/02/28 Python
PyQt+socket实现远程操作服务器的方法示例
2019/08/22 Python
Python tensorflow实现mnist手写数字识别示例【非卷积与卷积实现】
2019/12/19 Python
Python字符串hashlib加密模块使用案例
2020/03/10 Python
Python多进程编程multiprocessing代码实例
2020/03/12 Python
python递归函数用法详解
2020/10/26 Python
html5 Canvas画图教程(7)—canvas里画曲线之quadraticCurveTo方法
2013/01/09 HTML / CSS
Skyscanner波兰:廉价航班
2017/11/07 全球购物
阿尔卡特(中国)的面试题目
2014/08/20 面试题
顶碗少年教学反思
2014/02/21 职场文书
中学生学雷锋活动心得体会
2014/03/10 职场文书
企业文化建设实施方案
2014/03/22 职场文书
文明寝室申报材料
2014/05/12 职场文书
党的群众路线对照检查材料思想汇报
2014/09/25 职场文书
离退休人员聘用协议书
2014/11/24 职场文书
《角的初步认识》教学反思
2016/02/17 职场文书
Apache Pulsar结合Hudi构建Lakehouse方案分析
2022/03/31 Servers
CentOS安装Nginx并部署vue
2022/04/12 Servers