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 prototype,executing,context,closure
Dec 24 Javascript
JavaScript访问样式表代码
Oct 15 Javascript
基于json的jquery地区联动效果代码
Jul 06 Javascript
javascript排序函数实现数字排序
Jun 26 Javascript
JS深度拷贝Object Array实例分析
Mar 31 Javascript
如何判断Javascript对象是否存在的简单实例
May 18 Javascript
bootstrap基础知识学习笔记
Nov 02 Javascript
Jquery Easyui菜单组件Menu使用详解(15)
Dec 18 Javascript
Bootstrap Table使用整理(五)之分页组合查询
Jun 09 Javascript
分析JS中this引发的bug
Dec 12 Javascript
详解vue-cli 脚手架 安装
Apr 16 Javascript
JavaScript通如何过RGraph实现动态仪表盘
Oct 15 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
农民和部队如何穿矿
2020/03/04 星际争霸
PHP入门速成教程
2007/03/19 PHP
php 小乘法表实现代码
2009/07/16 PHP
PHP无限分类(树形类)的深入分析
2013/06/02 PHP
PHP 实现explort() 功能的详解
2013/06/20 PHP
使用GD库生成带阴影文字的图片
2015/03/27 PHP
PHP更安全的密码加密机制Bcrypt详解
2017/06/18 PHP
php实现文件上传基本验证
2020/03/04 PHP
基于jQuery的图片左右无缝滚动插件
2012/05/23 Javascript
javascript实现显示和隐藏div方法汇总
2015/08/14 Javascript
QQ登录背景闪动效果附效果演示源码下载
2015/09/22 Javascript
深入浅析Bootstrap列表组组件
2016/05/03 Javascript
简单实现js倒计时功能
2017/02/13 Javascript
使用 Javascript 实现浏览器推送提醒功能的示例
2017/11/03 Javascript
Vue父子组建的简单通信之控制开关Switch的实现
2018/06/04 Javascript
详解Vue中使用插槽(slot)、聚类插槽
2019/04/12 Javascript
js纯前端实现腾讯cos文件上传功能的示例代码
2019/05/14 Javascript
vue实现按需加载组件及异步组件功能
2019/05/27 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
2019/05/31 Javascript
Vue自定义表单内容检查rules实例
2020/10/30 Javascript
Python中使用HTMLParser解析html实例
2015/02/08 Python
Python的几个高级语法概念浅析(lambda表达式闭包装饰器)
2016/05/28 Python
Python实现的将文件每一列写入列表功能示例【测试可用】
2018/03/19 Python
Python八大常见排序算法定义、实现及时间消耗效率分析
2018/04/27 Python
对tf.reduce_sum tensorflow维度上的操作详解
2018/07/26 Python
对python模块中多个类的用法详解
2019/01/10 Python
使用python实现男神女神颜值打分系统(推荐)
2019/10/31 Python
详解Pycharm出现out of memory的终极解决方法
2020/03/03 Python
什么是python类属性
2020/06/10 Python
Python常用库Numpy进行矩阵运算详解
2020/07/21 Python
Python如何读写CSV文件
2020/08/13 Python
自愿离婚协议书范本
2015/01/26 职场文书
写给女朋友的检讨书
2015/05/06 职场文书
毕业季聚会祝酒词!
2019/07/04 职场文书
英镑符号 £
2022/02/17 杂记
「月刊Comic Alive」2022年5月号封面公开
2022/03/21 日漫