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 相关文章推荐
你可能不再需要JQUERY
Mar 09 Javascript
Asp.Net alert弹出提示信息的几种方法总结
Jan 29 Javascript
js判断图片加载完成后获取图片实际宽高的方法
Feb 25 Javascript
JavaScript 计算笛卡尔积实例详解
Dec 02 Javascript
bootstrap快速制作后台界面
Dec 05 Javascript
javascript实现文字无缝滚动
Dec 27 Javascript
BootStrap组件之进度条的基本用法
Jan 19 Javascript
jQuery实现的简单悬浮层功能完整实例
Jan 23 Javascript
Angular 表单控件示例代码
Jun 26 Javascript
详解用vue编写弹出框组件
Jul 04 Javascript
解决ztree搜索中多级菜单展示不全问题
Jul 05 Javascript
js中比较两个对象是否相同的方法示例
Sep 02 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网上调查系统
2006/10/09 PHP
一个SQL管理员的web接口
2006/10/09 PHP
PHPMyAdmin 快速配置方法
2009/05/11 PHP
php 多线程上下文中安全写文件实现代码
2009/12/28 PHP
PHP FATAL ERROR: CALL TO UNDEFINED FUNCTION BCMUL()解决办法
2014/05/04 PHP
Yii分页用法实例详解
2014/12/04 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
php实现兼容2038年后Unix时间戳转换函数
2015/03/18 PHP
php表单习惯用的正则表达式
2017/10/11 PHP
PHP实现可精确验证身份证号码的工具类示例
2018/05/31 PHP
仅IE9/10同时支持script元素的onload和onreadystatechange事件分析
2011/04/27 Javascript
jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
2013/01/04 Javascript
jQuery 中DOM 操作详解
2015/01/13 Javascript
jQuery插件Skippr实现焦点图幻灯片特效
2015/04/12 Javascript
使用JavaScript实现连续滚动字幕效果的方法
2015/07/07 Javascript
微信小程序(应用号)简单实例应用及实例详解
2016/09/26 Javascript
老生常谈javascript的类型转换
2016/10/12 Javascript
JS实现双击内容变为可编辑状态
2017/03/03 Javascript
Vue自定义过滤器格式化数字三位加一逗号实现代码
2018/03/23 Javascript
基于D3.js实现时钟效果
2018/07/17 Javascript
python正则表达式抓取成语网站
2013/11/20 Python
python装饰器使用方法实例
2013/11/21 Python
Python pickle类库介绍(对象序列化和反序列化)
2014/11/21 Python
使用Pyrex来扩展和加速Python程序的教程
2015/04/13 Python
python生成IP段的方法
2015/07/07 Python
python中的字典操作及字典函数
2018/01/03 Python
Python模拟浏览器上传文件脚本的方法(Multipart/form-data格式)
2018/10/22 Python
Python字符串对象实现原理详解
2019/07/01 Python
使用Tensorflow将自己的数据分割成batch训练实例
2020/01/20 Python
在 Python 中接管键盘中断信号的实现方法
2020/02/04 Python
荷兰皇家航空公司中国官网:KLM中国
2017/12/13 全球购物
行政助理岗位职责
2013/11/10 职场文书
主治医师岗位职责
2013/12/10 职场文书
2014年三八妇女节活动总结
2014/03/01 职场文书
人事任命书格式
2014/06/05 职场文书
「Manga Time Kirara MAX」2022年5月号封面公开
2022/03/21 日漫