JS数组去重常用方法实例小结【4种方法】


Posted in Javascript onMay 28, 2018

本文实例讲述了JS数组去重常用方法。分享给大家供大家参考,具体如下:

js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法

贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill

Array.prototype.indexOf = Array.prototype.indexOf || function(item) {
  for (var i = 0, j = this.length; i < j; i++) {
    if (this[i] === item) {
      return i;
    }
  }
  return -1;
}
Array.prototype.forEach = Array.prototype.forEach || function(callback, thisArg) {
  if (!callback || typeof callback !== 'function') return;
  for (var i = 0, j = this.length; i < j; i++) {
    callback.call(thisArg, this[i], i, this);
  }
}

方法一:遍历数组,建立新数组,利用indexOf判断是否存在于新数组中,不存在则push到新数组,最后返回新数组

function removeDuplicatedItem(ar) {
  var ret = [];
  for (var i = 0, j = ar.length; i < j; i++) {
    if (ret.indexOf(ar[i]) === -1) {
      ret.push(ar[i]);
    }
  }
  return ret;
}

方法二:遍历数组,利用object对象保存数组值,判断数组值是否已经保存在object中,未保存则push到新数组并用object[arrayItem]=1的方式记录保存

function removeDuplicatedItem2(ar) {
  var tmp = {},
    ret = [];
  for (var i = 0, j = ar.length; i < j; i++) {
    if (!tmp[ar[i]]) {
      tmp[ar[i]] = 1;
      ret.push(ar[i]);
    }
  }
  return ret;
}

方法三:数组下标判断法, 遍历数组,利用indexOf判断元素的值是否与当前索引相等,如相等则加入

function removeDuplicatedItem3(ar) {
  var ret = [];
  ar.forEach(function(e, i, ar) {
    if (ar.indexOf(e) === i) {
      ret.push(e);
    }
  });
  return ret;
}

方法四:数组先排序, 然后比较俩数组一头一尾进行去重

function removeDuplicatedItem4(ar) {
  var ret = [],
    end;
  ar.sort();
  end = ar[0];
  ret.push(ar[0]);
  for (var i = 1; i < ar.length; i++) {
    if (ar[i] != end) {
      ret.push(ar[i]);
      end = ar[i];
    }
  }
  return ret;
}

有其他好的方式 ,欢迎补充。

Javascript 相关文章推荐
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
Jul 31 Javascript
JavaScript设计模式之单例模式实例
Sep 24 Javascript
Javascript this 关键字 详解
Oct 22 Javascript
jquery控制页面部分刷新的方法
Jun 24 Javascript
JavaScript实现级联菜单的方法
Jun 29 Javascript
JavaScript高级程序设计(第三版)学习笔记1~5章
Mar 11 Javascript
Node.js返回JSONP详解
May 18 Javascript
JS原型对象的创建方法详解
Jun 16 Javascript
jQuery插件HighCharts实现气泡图效果示例【附demo源码】
Mar 13 Javascript
微信小程序商城项目之侧栏分类效果(1)
Apr 17 Javascript
详解如何使用koa实现socket.io官网的例子
Nov 04 Javascript
vue history 模式打包部署在域名的二级目录的配置指南
Jul 02 Javascript
jQuery中将json数据显示到页面表格的方法
May 27 #jQuery
javascript少儿编程关于返回值的函数内容
May 27 #Javascript
《javascript少儿编程》location术语总结
May 27 #Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
May 27 #Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
May 27 #Javascript
JS面向对象的程序设计相关知识小结
May 26 #Javascript
JavaScript门道之标准库
May 26 #Javascript
You might like
require(),include(),require_once()和include_once()的异同
2007/01/02 PHP
15种PHP Encoder的比较
2007/03/06 PHP
简单的PHP图片上传程序
2008/03/27 PHP
比较详细PHP生成静态页面教程
2012/01/10 PHP
PHP接口并发测试的方法(推荐)
2016/12/15 PHP
laravel 去掉index.php伪静态的操作方法
2019/10/12 PHP
高亮显示web页表格行的javascript代码
2010/11/19 Javascript
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
2013/04/28 Javascript
js中的preventDefault与stopPropagation详解
2014/01/29 Javascript
javascript实现节点(div)名称编辑
2014/12/17 Javascript
javascript每日必学之循环
2016/02/19 Javascript
javascript中不易分清的slice,splice和split三个函数
2016/03/29 Javascript
Vue.js 父子组件通讯开发实例
2016/09/06 Javascript
Extjs让combobox写起来简洁又漂亮
2017/01/05 Javascript
JavaScript基础之AJAX简单的小demo
2017/01/29 Javascript
扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框
2017/02/21 Javascript
关于Javascript中document.cookie的使用
2017/03/08 Javascript
微信小程序实时聊天WebSocket
2018/07/05 Javascript
在Python中使用defaultdict初始化字典以及应用方法
2018/10/31 Python
OpenCV3.0+Python3.6实现特定颜色的物体追踪
2019/07/23 Python
Python操作Mongodb数据库的方法小结
2019/09/10 Python
python实现机器人卡牌
2019/10/06 Python
python 截取XML中bndbox的坐标中的图像,另存为jpg的实例
2020/03/10 Python
解决django 向mysql中写入中文字符出错的问题
2020/05/18 Python
vscode配置anaconda3的方法步骤
2020/08/08 Python
Python‘==‘ 及 ‘is‘相关原理解析
2020/09/05 Python
老生常谈CSS中的长度单位
2016/06/27 HTML / CSS
CSS3效果:自定义“W”形运行轨迹实例
2017/03/29 HTML / CSS
Nike挪威官网:Nike.com (NO)
2018/11/26 全球购物
安全资金保障制度
2014/01/23 职场文书
家长通知书教师评语
2014/04/17 职场文书
优秀党支部书记事迹材料
2014/05/29 职场文书
医生爱岗敬业演讲稿
2014/08/26 职场文书
2014年房地产销售工作总结
2014/12/01 职场文书
初中班主任心得体会
2016/01/07 职场文书
Python编程super应用场景及示例解析
2021/10/05 Python