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现实多行信息
Aug 26 Javascript
location.href 在IE6中不跳转的解决方法与推荐使用代码
Jul 08 Javascript
javascript图片延迟加载实现方法及思路
Dec 31 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
Jan 12 Javascript
WordPress 单页面上一页下一页的实现方法【附代码】
Mar 10 Javascript
微信小程序报错:this.setData is not a function的解决办法
Sep 27 Javascript
详解用Node.js实现Restful风格webservice
Sep 29 Javascript
vue源码学习之Object.defineProperty 对数组监听
May 30 Javascript
vue实现的组件兄弟间通信功能示例
Dec 04 Javascript
el-select数据过多懒加载的解决(loadmore)
May 29 Javascript
基于vue 实现表单中password输入的显示与隐藏功能
Jul 19 Javascript
解析vue、angular深度作用选择器
Sep 11 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 截取字符串并以零补齐str_pad() 函数
2011/05/07 PHP
php笔记之:文章中图片处理的使用
2013/04/26 PHP
php中time()与$_SERVER[REQUEST_TIME]用法区别
2014/11/19 PHP
Codeigniter实现发送带附件的邮件
2015/03/19 PHP
PHP实现过滤各种HTML标签
2015/05/17 PHP
THINKPHP在添加数据的时候获取主键id的值方法
2017/04/03 PHP
php使用QueryList轻松采集js动态渲染页面方法
2018/09/11 PHP
laravel 解决crontab不执行的问题
2019/10/22 PHP
Expandable &quot;Detail&quot; Table Rows
2007/08/29 Javascript
javascript下利用arguments实现string.format函数
2010/08/24 Javascript
jQuery EasyUI API 中文文档 - ComboTree组合树
2011/10/11 Javascript
jQuery实现Flash效果上下翻动的中英文导航菜单代码
2015/09/22 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
微信小程序前端自定义分享的实现方法
2019/06/13 Javascript
你不可不知的Vue.js列表渲染详解
2019/10/01 Javascript
JavaScript提升机制Hoisting详解
2019/10/23 Javascript
three.js 制作动态二维码的示例代码
2020/07/31 Javascript
Antd的Table组件嵌套Table以及选择框联动操作
2020/10/24 Javascript
Python实现的Excel文件读写类
2015/07/30 Python
python使用xpath中遇到:到底是什么?
2018/01/04 Python
matplotlib 输出保存指定尺寸的图片方法
2018/05/24 Python
Python2.7.10以上pip更新及其他包的安装教程
2018/06/12 Python
使用pandas批量处理矢量化字符串的实例讲解
2018/07/10 Python
python中for循环输出列表索引与对应的值方法
2018/11/07 Python
django实现类似触发器的功能
2019/11/15 Python
详解pandas中iloc, loc和ix的区别和联系
2020/03/09 Python
python如何将图片转换素描画
2020/09/08 Python
Python爬取豆瓣数据实现过程解析
2020/10/27 Python
Python爬虫之Selenium设置元素等待的方法
2020/12/04 Python
基于Python实现天天酷跑功能
2021/01/06 Python
美术兴趣小组活动总结
2014/07/07 职场文书
个人投资合作协议书
2014/10/12 职场文书
办公楼租房协议书范本
2014/11/25 职场文书
中国梦党课学习心得体会
2016/01/05 职场文书
小学语文课《掌声》教学反思
2016/03/03 职场文书
python使用shell脚本创建kafka连接器
2022/04/29 Python