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 相关文章推荐
window.onload 加载完毕的问题及解决方案(下)
Jul 09 Javascript
传智播客学习之java 反射
Nov 22 Javascript
基于jquery实现的鼠标滑过按钮改变背景图片
Jul 15 Javascript
用jQuery中的ajax分页实现代码
Sep 20 Javascript
在Linux上用forever实现Node.js项目自启动
Jul 09 Javascript
轻松搞定jQuery.noConflict()
Feb 15 Javascript
JS代码实现百度地图 画圆 删除标注
Oct 12 Javascript
通过源码分析Vue的双向数据绑定详解
Sep 24 Javascript
Vue编写可显示周和月模式的日历 Vue自定义日历内容的显示
Jun 26 Javascript
javascript 原型与原型链的理解及实例分析
Nov 23 Javascript
JavaScript直接调用函数与call调用的区别实例分析
May 22 Javascript
vue 授权获取微信openId操作
Nov 13 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
mysql5写入和读出乱码解决
2006/11/25 PHP
PHP伪静态写法附代码
2008/06/20 PHP
对squid中refresh_pattern的一些理解和建议
2009/04/17 PHP
PHP性能优化准备篇图解PEAR安装
2011/12/05 PHP
php绘制一条弧线的方法
2015/01/24 PHP
php文件操作之小型留言本实例
2015/06/20 PHP
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
2011/08/28 Javascript
下拉列表选择项的选中在不同浏览器中的兼容性问题探讨
2013/09/18 Javascript
jquery获取选中的文本和值的方法
2014/07/08 Javascript
JavaScript实现弹出子窗口并传值给父窗口
2014/12/18 Javascript
javascript实现漂亮的拖动层,窗口拖拽特效
2015/04/24 Javascript
jQuery插件支持同一页面被多次调用
2016/02/14 Javascript
Vue引入sass并配置全局变量的方法
2018/06/27 Javascript
vue 自定义指令自动获取文本框焦点的方法
2018/08/25 Javascript
Vue 样式绑定的实现方法
2019/01/15 Javascript
微信小程序使用websocket通讯的demo,含前后端代码,亲测可用
2019/05/22 Javascript
微信小程序实现上传图片裁剪图片过程解析
2019/08/22 Javascript
JS实现贪吃蛇游戏
2019/11/15 Javascript
再也不怕 JavaScript 报错了,怎么看怎么处理都在这儿
2020/12/09 Javascript
[42:00]完美世界DOTA2联赛PWL S3 Phoenix vs INK ICE 第一场 12.13
2020/12/17 DOTA
python分析网页上所有超链接的方法
2015/05/08 Python
Python中IPYTHON入门实例
2015/05/11 Python
在Python中操作时间之strptime()方法的使用
2020/12/30 Python
Python图算法实例分析
2016/08/13 Python
python字典键值对的添加和遍历方法
2016/09/11 Python
python处理csv中的空值方法
2018/06/22 Python
Python列表(List)知识点总结
2019/02/18 Python
python单例设计模式实现解析
2020/01/07 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
浅谈tensorflow使用张量时的一些注意点tf.concat,tf.reshape,tf.stack
2020/06/23 Python
超市营业员求职简历的自我评价
2013/10/17 职场文书
党员岗位承诺口号大全
2014/03/28 职场文书
新法人代表任命书
2014/06/06 职场文书
机关作风建设工作总结
2014/10/23 职场文书
2015年中秋节主持词
2015/07/30 职场文书
Android Flutter实现图片滑动切换效果
2022/04/07 Java/Android