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 jqgrid 对含特殊字符json 数据的 Java 处理方法
Jan 01 Javascript
jquery.tmpl JQuery模板插件
Oct 10 Javascript
关于 文本框默认值 的操作js代码
Jan 12 Javascript
javascript获取flash版本号的方法
Nov 20 Javascript
.NET微信公众号开发之创建自定义菜单
Jul 16 Javascript
jquery——九宫格大转盘抽奖实例
Jan 16 Javascript
bootstrap配合Masonry插件实现瀑布式布局
Jan 18 Javascript
ES6学习之变量的两种命名方法示例
Jul 18 Javascript
seajs中最常用的7个功能、配置示例
Oct 10 Javascript
Angular 开发学习之Angular CLI的安装使用
Dec 31 Javascript
vue-router 路由传参用法实例分析
Mar 06 Javascript
微信小程序实现可长按移动控件
Nov 01 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
PHP date函数参数详解
2006/11/27 PHP
PHP 已经成熟
2006/12/04 PHP
php下实现在指定目录搜索指定类型文件的函数
2008/10/03 PHP
PHP图像处理之使用imagecolorallocate()函数设置颜色例子
2014/11/19 PHP
php将字符串转换成16进制的方法
2015/03/17 PHP
PHP实现的多维数组排序算法分析
2018/02/10 PHP
PHP检查URL包含特定字符串实例方法
2019/02/11 PHP
jquery中动态效果小结
2010/12/16 Javascript
jQuery列表拖动排列具体实现
2013/11/04 Javascript
JavaScript中的Promise使用详解
2015/06/24 Javascript
JS实现无限级网页折叠菜单(类似树形菜单)效果代码
2015/09/17 Javascript
谈谈js中的prototype及prototype属性解释和常用方法
2015/11/25 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
2016/10/20 Javascript
jQuery如何跳转到另一个网页 就这么简单
2016/12/28 Javascript
javascript 网页进度条简单实例
2017/02/22 Javascript
JS实现含有中文字符串的友好截取功能分析
2017/03/13 Javascript
JavaScript中在光标处插入添加文本标签节点的详细方法
2017/03/22 Javascript
JS通过调用微信API实现微信支付功能的方法示例
2017/06/29 Javascript
JS如何寻找数组中心索引过程解析
2020/06/01 Javascript
详解javascript void(0)
2020/07/13 Javascript
Python迭代用法实例教程
2014/09/08 Python
Python新手在作用域方面经常容易碰到的问题
2015/04/03 Python
Python+Selenium自动化实现分页(pagination)处理
2017/03/31 Python
详解python中的Turtle函数库
2018/11/19 Python
Django命名URL和反向解析URL实现解析
2019/08/09 Python
Python Web框架之Django框架Form组件用法详解
2019/08/16 Python
Matlab中plot基本用法的具体使用
2020/07/17 Python
python调用百度AI接口实现人流量统计
2021/02/03 Python
css 元素选择器的简单实例
2016/05/23 HTML / CSS
英国性感内衣和睡衣品牌:Bluebella
2018/01/26 全球购物
JSF面试题:如何管量web层中的Bean,用什么标签。如何通过jsp页面与Bean绑定在一起进行处理?
2012/10/05 面试题
索引覆盖(Index Covering)查询含义
2012/02/18 面试题
建筑经济管理专业求职信分享
2014/01/06 职场文书
乡镇团委工作总结2015
2015/05/26 职场文书
小学生优秀作文范文(六篇)
2019/07/10 职场文书
使用css样式设计一个简单的html登陆界面的实现
2021/03/30 HTML / CSS