JavaScript数组去重实现方法小结


Posted in Javascript onJanuary 17, 2020

本文实例讲述了JavaScript数组去重实现方法。分享给大家供大家参考,具体如下:

一、ES3方法:

var arr = ['a', 'a', 'b', 'b', 'b', 'c', 'e', 'f', 1, 2, 2, 3, 3, 3];

创建一个空数组与原来数组进行比较

//与前面的数组进行比较(不会改变原数组)
function deleteRepeat() {
  var result = [];
  label: for(var i=0; i<arr.length; i++) {
    for(var j=0; j<result.length; j++) {
      if(result[j] == arr[i]) {
        continue label;
      }
    }
    result.push(arr[i]);
  }
  return result;
}
//与后面的进行比较(不会改变原数组)
function deleteRepeat() {
  var result = [];
  for(var i = 0; i < arr.length; i++) {
    for(var j = i+1; j < arr.length; j++) {
      if(arr[i] == arr[j]) {
        j = ++i;
      }
    }
    result.push(arr[i]);
  }
  return result;
}
// splice()方法 (会改变原数组)
function deleteRepeat() {
  for(var i = 0; i < arr.length; i++) {
    for(var j = i+1; j < arr.length; j++) {
      if(arr[i] == arr[j]) {
        arr.splice(j, 1);
        j--;
      }
    }
  }
  return arr;
}
// 利用对象的属性不能重复特点(不会改变原数组)
function deleteRepeat() {
  var result = [];
  var object = {};
  for(var i = 0; i < arr.length; i++) {
    var t = arr[i];
    if(!object[t]) {
      result.push(t);
      object[t] = true;
    } 
  }
  return result;
}
// 先排序再去重(只需要进行一次for循环、 会改变原数组)
function deleteRepeat() {
  var arr1 = arr.sort();
  var result = [];
  for(var i = 0; i < arr1.length; i++) {
    if(arr1[i] != arr1[i+1]) {
      result.push(arr1[i]);
    }
  }
  return result;
}

二、ES5方法:

利用IndexOf()方法

map()方法或forEach()方法或filter()方法

三、ES6方法

var a = [1, 2, 2, 3, 3, 3];
[...new Set(a)];
[1, 2, 3]

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

Javascript 相关文章推荐
Javascript 中文字符串处理额外注意事项
Nov 15 Javascript
JS遮罩层效果 兼容ie firefox jQuery遮罩层
Jul 26 Javascript
js 通用javascript函数库整理
Aug 14 Javascript
Javascript中的apply()方法浅析
Mar 15 Javascript
Jquery实现瀑布流布局(备有详细注释)
Jul 31 Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
Jun 01 Javascript
微信小程序 数据访问实例详解
Oct 08 Javascript
angularjs ocLazyLoad分步加载js文件实例
Jan 17 Javascript
JQuery 选择器、DOM节点操作练习实例
Sep 28 jQuery
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
Nov 21 Javascript
通过jQuery学习js类型判断的技巧
May 27 jQuery
JavaScript实现缓动动画
Nov 25 Javascript
JS面向对象之多选框实现
Jan 17 #Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
Jan 17 #Javascript
JS面向对象之单选框实现
Jan 17 #Javascript
原生JavaScript实现的无缝滚动功能详解
Jan 17 #Javascript
vuejs中父子组件之间通信方法实例详解
Jan 17 #Javascript
React Hooks 实现和由来以及解决的问题详解
Jan 17 #Javascript
详解搭建一个vue-cli的移动端H5开发模板
Jan 17 #Javascript
You might like
php模块memcache和memcached区别分析
2011/06/14 PHP
php生成excel列名超过26列大于Z时的解决方法
2014/12/29 PHP
详解PHP实现执行定时任务
2015/12/21 PHP
PHP模糊查询的实现方法(推荐)
2016/09/06 PHP
php 魔术常量详解及实例代码
2016/12/04 PHP
菜鸟javascript基础资料整理2
2010/12/06 Javascript
基于jquery的web页面日期格式化插件
2011/11/15 Javascript
getElementByIdx_x js自定义getElementById函数
2012/01/24 Javascript
js中parseInt函数浅谈
2013/07/31 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
2014/06/03 Javascript
用C/C++来实现 Node.js 的模块(二)
2014/09/24 Javascript
jQuery中contents()方法用法实例
2015/01/08 Javascript
JavaScript中模拟实现jsonp
2015/06/19 Javascript
Bootstrap CSS组件之下拉菜单(dropdown)
2016/12/17 Javascript
Vue报错:Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#‘的解决方法
2017/06/17 Javascript
如何解决React官方脚手架不支持Less的问题(小结)
2018/09/12 Javascript
zepto.js 实时监听输入框的方法
2018/12/04 Javascript
vue-cli webpack配置文件分析
2019/05/20 Javascript
layui 对弹窗 form表单赋值的实现方法
2019/09/04 Javascript
详解Vue数据驱动原理
2020/11/17 Javascript
五句话帮你轻松搞定js原型链
2020/12/09 Javascript
[01:45]IMBATV TI4前线报道-选手到达
2014/07/07 DOTA
Python的标准模块包json详解
2017/03/13 Python
python实现折半查找和归并排序算法
2017/04/14 Python
TensorFlow神经网络优化策略学习
2018/03/09 Python
基于Python3.6+splinter实现自动抢火车票
2018/09/25 Python
使用django-guardian实现django-admin的行级权限控制的方法
2018/10/30 Python
Python实现随机取一个矩阵数组的某几行
2019/11/26 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
对Tensorflow中tensorboard日志的生成与显示详解
2020/02/04 Python
python使用python-pptx删除ppt某页实例
2020/02/14 Python
梅西百货澳大利亚:Macy’s Australia
2017/07/26 全球购物
德国运动营养和健身网上商店:Myprotein.de
2018/07/18 全球购物
2013的个人自我评价
2013/12/26 职场文书
校园歌手大赛策划书
2014/01/17 职场文书
2015年班级工作总结范文
2015/04/03 职场文书