JS数组去重的6种方法完整实例


Posted in Javascript onDecember 08, 2018

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>3water.com 数组去重</title>
  </head>
  <body>
    <script>
      //1.filter:(indexOf)方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素, filter() 不会对空数组进行检测。 filter() 不会改变原始数组。
      var arr1 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      var arr1_1 = arr1.filter(function(m, n) {
        return arr1.indexOf(m) == n;
      })
      document.write(arr1_1 + "<br />");
      //2.map:(push indexOf)把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。
      var arr2 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      var arr2_2 = [];
      arr2.map(function(m, n) {
        if(arr2.indexOf(arr2[n]) == n) {
          arr2_2.push(m);
        }
      });
      document.write(arr2_2 + "<br />");
      //3.indexOf(push)搜索数组中的元素,并返回它所在的位置。
      var arr3 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      var arr3_3 = [];
      for(var i = 0; i < arr3.length; i++) {
        if(arr3_3.indexOf(arr3[i]) == -1) {
          arr3_3.push(arr3[i]);
        }
      }
      document.write(arr3_3 + "<br />");
      //4.splice对数组进行删除、插入、替换,是最强大的数组方法。改变原数组
      var arr4 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      for(var i = 0; i < arr4.length; i++) {
        for(var j = i + 1; j < arr4.length; j++) {
          if(arr4[i] == arr4[j]) {
            arr4.splice(j, 1)
            j--; //别忘记减
          }
        }
      }
      document.write(arr4 + "<br />");
      //5.push(数组去重一一对比)添加到数组末尾
      var arr5 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      function remm(arr) {
        var arr5_5 = [];
        for(var i = 0; i < arr5.length; i++) {
          for(var j = 0; j < arr5.length; j++) {
            if(arr5[i] == arr5_5[j]) {
              break;
            }
          }
          if(arr5[i] != arr5_5[j]) {
            arr5_5.push(arr5[i]);
          }
        }
        return arr5_5;
      }
      document.write(remm(arr5) + "<br />");
      //6.set数据结构Set类似于数组,但是成员的值都是唯一的,没有重复的值。用set.size表示伪数组长度
    var arr6= [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3];
      var set = new Set(arr6);
      var newArr = new Array(...set);
      document.write(newArr+"<br />");
    </script>
  </body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码,可得到如下运行结果:

JS数组去重的6种方法完整实例

Javascript 相关文章推荐
javascript中的几个运算符
Jun 29 Javascript
表单填写时用回车代替TAB的实现方法
Oct 09 Javascript
jquery 图片上传按比例预览插件集合
May 28 Javascript
用Mootools获得操作索引的两种方法分享
Dec 12 Javascript
javascript正则表达式中的replace方法详解
Apr 20 Javascript
初步认识JavaScript函数库jQuery
Jun 18 Javascript
详解JavaScript对Date对象的操作问题(生成一个倒数7天的数组)
Oct 01 Javascript
理解JavaScript中worker事件api
Dec 25 Javascript
Vue下拉框回显并默认选中随机问题
Sep 06 Javascript
探秘vue-rx 2.0(推荐)
Sep 21 Javascript
原生js实现each方法实例代码详解
May 27 Javascript
json解析大全 双引号、键值对不在一起的情况
Dec 06 Javascript
原生JS实现的放大镜特效示例【测试可用】
Dec 08 #Javascript
JS实现的小火箭发射动画效果示例
Dec 08 #Javascript
jQuery时间戳和日期相互转换操作示例
Dec 07 #jQuery
ES6的Fetch异步请求的实现方法
Dec 07 #Javascript
JavaScript this绑定过程深入详解
Dec 07 #Javascript
React 使用recharts实现散点地图的示例代码
Dec 07 #Javascript
如何手动实现es5中的bind方法详解
Dec 07 #Javascript
You might like
用php获取远程图片并把它保存到本地的代码
2008/04/07 PHP
表格展示无限级分类(PHP版)
2012/08/21 PHP
浅析PHP原理之变量(Variables inside PHP)
2013/08/09 PHP
PHP将两个关联数组合并函数提高函数效率
2014/03/18 PHP
WordPress主题制作中自定义头部的相关PHP函数解析
2016/01/08 PHP
JS小框架 fly javascript framework
2009/11/26 Javascript
jquery实现的超出屏幕时把固定层变为定位层的代码
2010/02/23 Javascript
ASP.NET jQuery 实例11 通过使用jQuery validation插件简单实现用户登录页面验证功能
2012/02/03 Javascript
jQuery之折叠面板的深入解析
2013/06/19 Javascript
把input初始值不写value的具体实现方法
2013/07/04 Javascript
利用毫秒减值计算时长的js代码
2013/09/22 Javascript
jQuery+Ajax实现无刷新操作
2016/01/04 Javascript
通过jquery-ui中的sortable来实现拖拽排序的简单实例
2016/05/24 Javascript
JS判断是否手机或pad访问实现方法
2016/12/09 Javascript
DropDownList控件绑定数据源的三种方法
2016/12/24 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
2017/01/23 Javascript
jQuery实现form表单基于ajax无刷新提交方法实例代码
2019/11/04 jQuery
原生js实现随机点名功能
2019/11/05 Javascript
python实现二分查找算法
2017/09/21 Python
Python利用Django如何写restful api接口详解
2018/06/08 Python
Python快速查找list中相同部分的方法
2018/06/27 Python
Python3.7 pyodbc完美配置访问access数据库
2019/10/03 Python
简单了解Pandas缺失值处理方法
2019/11/16 Python
python实现宿舍管理系统
2019/11/22 Python
python全局变量引用与修改过程解析
2020/01/07 Python
详解基于Jupyter notebooks采用sklearn库实现多元回归方程编程
2020/03/25 Python
多个版本的python共存时使用pip的正确做法
2020/10/26 Python
Python加载数据的5种不同方式(收藏)
2020/11/13 Python
python实现学生通讯录管理系统
2021/02/25 Python
如何用css3实现switch组件开关的方法
2018/02/09 HTML / CSS
芬兰攀岩、山地运动和户外活动用品购物网站:Bergfreunde
2016/10/06 全球购物
护理专业本科生自荐信
2013/10/01 职场文书
国际贸易个人求职信范文
2014/01/04 职场文书
煤矿机修工岗位职责
2014/02/07 职场文书
优秀大学生求职自荐信范文
2014/04/19 职场文书
作文评语集锦大全
2014/04/23 职场文书