总结Javascript中数组各种去重的方法


Posted in Javascript onOctober 04, 2016

前言

在做javascript开发的时候,经常会遇到数组元素重复的问题,而javascript Array又没有直接提供方法解决此问题,还需要自己去实现。这篇文章总结了Javascript中数组各种去重的方法,下面来一起看看。

方法一 利用对象属性不重复的特性

Array.prototype.distinct = function (){
  var arr = this,
    i,
    obj = {},
    result = [],
    len = arr.length;
  for(i = 0; i< arr.length; i++){
    if(!obj[arr[i]]){  //如果能查找到,证明数组元素重复了
      obj[arr[i]] = 1;
      result.push(arr[i]);
    }
  }
  return result;
};

方法二 双层循环,外层循环元素,内层循环时比较值

Array.prototype.distinct = function(){
  var arr = this,
    result = [],
    i,
    j,
    len = arr.length;
  for(i = 0; i < len; i++){
    for(j = i + 1; j < len; j++){
      if(arr[i] === arr[j]){
        j = ++i;
      }
    }
    result.push(arr[i]);
  }
  return result;
}

方法三 数组递归去重

Array.prototype.distinct = function (){
  var arr = this,
    len = arr.length;
  arr.sort(function(a,b){    //对数组进行排序才能方便比较
    return a - b;
  })
  function loop(index){
    if(index >= 1){
      if(arr[index] === arr[index-1]){
        arr.splice(index,1);
      }
      loop(index - 1);  //递归loop函数进行去重
    }
  }
  loop(len-1);
  return arr;
};

方法四 利用indexOf以及forEach

Array.prototype.distinct = function (){
  var arr = this,
    result = [],
    len = arr.length;
  arr.forEach(function(v, i ,arr){    //这里利用map,filter方法也可以实现
    var bool = arr.indexOf(v,i+1);    //从传入参数的下一个索引值开始寻找是否存在重复
    if(bool === -1){
      result.push(v);
    }
  })
  return result;
};

方法五 利用ES6的set

function dedupe(array){
  return Array.from(new Set(array));
}
dedupe([1,1,2,3]) //[1,2,3]

方法六 拓展运算符(…)内部使用for…of循环

let arr = [3,5,2,2,5,5];
let unique = [...new Set(arr)];  //[3,5,2]

总结

好了,以上就是这篇文章的全部内容了,个人比较喜欢使用方法一,不会对原数组进行修改,希望这篇文章对大家能有所帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
防止动态加载JavaScript引起的内存泄漏问题
Oct 08 Javascript
基于JQuery的访问WebService的代码(可访问Java[Xfire])
Nov 19 Javascript
js在IE与firefox的差异集锦
Nov 11 Javascript
jquery判断复选框是否被选中的方法
Oct 16 Javascript
jQuery获取单击节点对象的方法
Jun 02 Javascript
Angular Module声明和获取重载实例代码
Sep 14 Javascript
json定义及jquery操作json的方法
Oct 03 Javascript
js实现贪吃蛇小游戏(容易理解)
Jan 22 Javascript
基于Node.js的WebSocket通信实现
Mar 11 Javascript
angularjs实现table增加tr的方法
Feb 27 Javascript
浏览器事件循环与vue nextTicket的实现
Apr 16 Javascript
JavaScript修改注册表实例代码
Jan 05 Javascript
Javascript中arguments对象的详解与使用方法
Oct 04 #Javascript
js判断浏览器是否支持严格模式的方法
Oct 04 #Javascript
浅谈jquery高级方法描述与应用
Oct 04 #Javascript
vue.js中$watch的用法示例
Oct 04 #Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
Oct 04 #Javascript
用jquery快速解决IE输入框不能输入的问题
Oct 04 #Javascript
JavaScript九九乘法口诀表的简单实现
Oct 04 #Javascript
You might like
把77A收信机改造成收音机
2021/03/02 无线电
php获得当前的脚本网址
2007/12/10 PHP
php实现zip压缩文件解压缩代码分享(简单易懂)
2014/05/10 PHP
PHP依赖注入(DI)和控制反转(IoC)详解
2017/06/12 PHP
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
Swoole4.4协程抢占式调度器详解
2019/05/23 PHP
JavaScript 反科里化 this [译]
2012/09/20 Javascript
javascript实现俄罗斯方块游戏的思路和方法
2015/04/27 Javascript
JS实现的页面自定义滚动条效果
2015/10/26 Javascript
jQuery实现响应鼠标事件的图片透明效果【附demo源码下载】
2016/06/16 Javascript
node.js请求HTTPS报错:UNABLE_TO_VERIFY_LEAF_SIGNATURE\的解决方法
2016/12/18 Javascript
Linux使用Node.js建立访问静态网页的服务实例详解
2017/03/21 Javascript
JS Input里添加小图标的两种方法
2017/11/11 Javascript
axios发送post请求springMVC接收不到参数的解决方法
2018/03/05 Javascript
js定义类的方法示例【ES5与ES6】
2019/07/30 Javascript
微信小程序图片右边加两行文字的代码
2020/04/23 Javascript
vue 封装面包屑组件教程
2020/11/16 Javascript
[00:34]DOTA2上海特级锦标赛 VG战队宣传片
2016/03/04 DOTA
Python中列表和元组的相关语句和方法讲解
2015/08/20 Python
python+selenium实现163邮箱自动登陆的方法
2017/12/31 Python
Python实现的基于优先等级分配糖果问题算法示例
2018/04/25 Python
Windows下PyCharm安装图文教程
2018/08/27 Python
使用python接入微信聊天机器人
2020/03/31 Python
python requests更换代理适用于IP频率限制的方法
2019/08/21 Python
利用rest framework搭建Django API过程解析
2019/08/31 Python
python GUI库图形界面开发之PyQt5菜单栏控件QMenuBar的详细使用方法与实例
2020/02/28 Python
python如何将两张图片生成为全景图片
2020/03/05 Python
python3列表删除大量重复元素remove()方法的问题详解
2021/01/04 Python
澳大利亚牛仔裤商店:Just Jeans
2016/10/13 全球购物
销售心得体会
2014/01/02 职场文书
七一表彰活动方案
2014/01/18 职场文书
《水上飞机》教学反思
2014/04/10 职场文书
给老婆的保证书怎么写
2015/05/08 职场文书
2015年会计人员工作总结
2015/05/22 职场文书
PostgreSQL将数据加载到buffer cache中操作方法
2021/04/16 PostgreSQL
浅谈mysql增加索引不生效的几种情况
2021/06/23 MySQL