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 相关文章推荐
JQuery获取浏览器窗口内容部分高度的代码
Feb 24 Javascript
基于jquery的放大镜效果
May 30 Javascript
node.js 开发指南 ? Node.js 连接 MySQL 并进行数据库操作
Jul 29 Javascript
JavaScript实现广告的关闭与显示效果实例
Jul 02 Javascript
js判断鼠标位置是否在某个div中的方法
Feb 26 Javascript
js中的关联数组与普通数组详解
Jul 27 Javascript
JSON与js对象序列化实例详解
Mar 16 Javascript
jquery手机触屏滑动拼音字母城市选择器的实例代码
Dec 11 jQuery
简化vuex的状态管理方案的方法
Jun 02 Javascript
vue this.reload 方法 配置
Sep 12 Javascript
《javascript设计模式》学习笔记五:Javascript面向对象程序设计工厂模式实例分析
Apr 08 Javascript
javascript设计模式 ? 模板方法模式原理与用法实例分析
Apr 23 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
解决了Ajax、MySQL 和 Zend Framework 的乱码问题
2009/03/03 PHP
PHP 第二节 数据类型之转换
2012/04/28 PHP
jQuery ajax+PHP实现的级联下拉列表框功能示例
2019/02/12 PHP
PHP生成zip压缩包的常用方法示例
2019/08/22 PHP
Laravel框架之解决前端显示图片问题
2019/10/24 PHP
PHP For循环字母A-Z当超过26个字母时输出AA,AB,AC
2020/02/16 PHP
解决Laravel5.x的php artisan migrate数据库迁移创建操作报错SQLSTATE[42000]
2020/04/06 PHP
arguments对象
2006/11/20 Javascript
动态创建的表格单元格中的事件实现代码
2008/12/30 Javascript
Jquery选择子控件&quot;大于号&quot;和&quot; &quot;区别介绍及使用示例
2013/06/25 Javascript
Jquery EasyUI中弹出确认对话框以及加载效果示例代码
2014/02/13 Javascript
js和jquery中循环的退出和继续下一个循环
2014/09/03 Javascript
JavaScript中的Math.LN2属性用法详解
2015/06/12 Javascript
基于jQuery实现的扇形定时器附源码下载
2015/10/20 Javascript
jquery实用技巧之输入框提示语句
2016/07/28 Javascript
微信小程序 wx.uploadFile在安卓手机上面the same task is working问题解决
2016/12/14 Javascript
vue中post请求以a=a&amp;b=b 的格式写遇到的问题
2018/04/27 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
2018/08/30 Javascript
利用d3.js力导布局绘制资源拓扑图实例教程
2019/01/08 Javascript
一篇文章介绍redux、react-redux、redux-saga总结
2019/05/23 Javascript
微信小程序实现下拉刷新动画
2019/06/21 Javascript
vuex actions异步修改状态的实例详解
2019/11/06 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
用Python程序抓取网页的HTML信息的一个小实例
2015/05/02 Python
Python面向对象编程基础实例分析
2020/01/17 Python
HTML5中input[type='date']自定义样式与日历校验功能的实现代码
2017/07/11 HTML / CSS
大学生求职简历的自我评价范文
2013/10/12 职场文书
幼儿园儿童节主持词
2014/03/21 职场文书
单位法定代表人授权委托书
2014/09/20 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
离婚起诉状范本
2015/05/19 职场文书
对学校的意见和建议
2015/06/04 职场文书
三八节活动简报
2015/07/20 职场文书
2016年植树节红领巾广播稿
2015/12/17 职场文书
css常用字体属性与背景属性介绍
2022/02/28 HTML / CSS
Python装饰器详细介绍
2022/03/25 Python