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 相关文章推荐
extjs 学习笔记(二) Ext.Element类
Oct 13 Javascript
javascript 设为首页与加入收藏兼容多浏览器代码
Jan 11 Javascript
Javascript连接多个数组不用concat来解决
Mar 24 Javascript
js动态移动滚动条至底部示例代码
Apr 24 Javascript
Javascript原型链和原型的一个误区
Oct 22 Javascript
详解JavaScript函数
Dec 01 Javascript
使用vue编写一个点击数字计时小游戏
Aug 31 Javascript
微信小程序实现滑动切换自定义页码的方法分析
Dec 29 Javascript
Vue 组件修改根实例的数据的方法
Apr 02 Javascript
layui-table对返回的数据进行转变显示的实例
Sep 04 Javascript
解决layui-table单元格设置为百分比在ie8下不能自适应的问题
Sep 28 Javascript
微信小程序加载机制及运行机制图解
Nov 27 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读取CURL模拟登录时生成Cookie文件的方法
2014/11/04 PHP
详解WordPress中创建和添加过滤器的相关PHP函数
2015/12/29 PHP
PHP 中常量的知识整理
2017/04/14 PHP
php 中self,this的区别和操作方法实例分析
2019/11/04 PHP
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
2008/09/08 Javascript
node.js中的http.createServer方法使用说明
2014/12/14 Javascript
JS实现超过长度限制后自动跳转下一款文本框的方法
2015/02/23 Javascript
使用OpenLayers3 添加地图鼠标右键菜单
2015/12/29 Javascript
js仿淘宝和百度文库的评分功能
2016/05/15 Javascript
AngularJS入门教程之服务(Service)
2016/07/27 Javascript
jQuery文字轮播特效
2017/02/12 Javascript
ThinkPHP+jquery实现“加载更多”功能代码
2017/03/11 Javascript
实现微信小程序的wxml文件和wxss文件在webstrom的支持
2017/06/12 Javascript
ionic环境配置及问题详解
2017/06/27 Javascript
JS实现的简单四则运算计算器功能示例
2017/09/27 Javascript
Vue——前端生成二维码的示例
2020/12/19 Vue.js
[24:42]VP vs TNC Supermajor小组赛B组 BO3 第三场 6.2
2018/06/03 DOTA
[47:04]EG vs RNG 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
python面向对象 反射原理解析
2019/08/12 Python
如何基于python操作excel并获取内容
2019/12/24 Python
Pytorch实现各种2d卷积示例
2019/12/30 Python
Python 实现打印单词的菱形字符图案
2020/04/12 Python
python 元组的使用方法
2020/06/09 Python
Selenium执行完毕未关闭chromedriver/geckodriver进程的解决办法(java版+python版)
2020/12/07 Python
在python中对于bool布尔值的取反操作
2020/12/11 Python
CSS3 清除浮动的方法示例
2018/06/01 HTML / CSS
HTML5注册表单的自动聚焦与占位文本示例代码
2013/07/19 HTML / CSS
美国网上花店:JustFlowers
2017/02/12 全球购物
美国知名的家庭连锁百货商店:Boscov’s
2017/07/27 全球购物
荷兰鞋子在线:Nelson Schoenen
2017/12/25 全球购物
幼儿园老师辞职信
2014/01/20 职场文书
行政管理专业求职信
2014/07/06 职场文书
2014年餐厅服务员工作总结
2014/11/18 职场文书
初中家长评语大全
2014/12/26 职场文书
工程合作意向书范本
2015/05/09 职场文书
2016年村干部公开承诺书(公开承诺事项)
2016/03/25 职场文书