JavaScript常见的五种数组去重的方式


Posted in Javascript onDecember 15, 2016

大致介绍

JavaScript的数组去重问题在许多面试中都会遇到,现在做个总结

先来建立一个数组

var arr = [1,2,3,3,2,'我','我',34,'我的',NaN,NaN];

第一种

思路:建立一个临时数组,用for循环去依次判断arr中的每个项在临时数组中是否有相同的值,如果没有则将这个值添加到临时数组,如果有相同的值则不添加,最后返回这个临时数组

代码:

Array.prototype.removeDuplicate = function(){
  var n = [];
  for(var i=0;i<this.length;i++){
  if(n.indexOf(this[i]) == -1 ){
  n.push(this[i]);
  }
  }
 return n;
}
var m = arr.removeDuplicate();
console.log(m);//[1, 2, 3, "我", 34, "我的", NaN, NaN]

注意:不会去掉重复的NaN值

第二种

 

思路:建立一个临时数组,用for循环利用indexOf()方法去依次判断arr中的每个项在arr中第一次出现的位置,如果这个项在arr中第一次出现的位置就是它的位置,表明在它之前没有相同的值则把它添加到临时数组中,如果这个项在arr中第一次出现的位置不是他的位置则表明在它之前有相同的值,则不把他添加到临时数组中;最后返回临时数组

代码:

Array.prototype.removeDuplicate = function(){
  var n = [];
  for(var i=0;i<this.length-1;i++){
  if(this.indexOf(this[i]) == i){
  n.push(this[i]);
  }
  }
 return n;
 }
 var m = arr.removeDuplicate();
 console.log(m);//[1, 2, 3, "我", 34, "我的"]

注意:会把NaN值删除

第三种

思路:建立一个临时对象,利用for循环检测这个临时对象有没有arr[i]这个属性,如果没有这个属性表明arr[i]在它之前没有和它重复的值。把临时对象的arr[i]属性设置为true,表明有这个属性并把这个项添加到临时数组中;最后返回临时数组

代码:

Array.prototype.removeDuplicate = function(){
  var n = [],m = {};
  for(var i=0;i<this.length;i++){
  if(!m[this[i]]){
  m[this[i]] = true;
  n.push(this[i]);
  }
  }
 return n;
 }
var m = arr.removeDuplicate();
console.log(m);//[1, 2, 3, "我", 34, "我的", NaN]

第四种

思路:先将这个数组排序,然后比较每个项和它后面的项的值是否相等,如果不相等则添加到临时数组中;最后返回临时数组

代码:

Array.prototype.removeDuplicate = function(){
 var n = [];
 this.sort();
 for(var i=0;i<this.length;i++){
 if(this[i] != this[i+1]){
  n.push(this[i]);
  }
 }
 return n;
 }
var m = arr.removeDuplicate();
console.log(m);//[1, 2, 3, 34, NaN, NaN, "我", "我的"]

注意:不会去掉重复的NaN值

第五种

思路:利用ES6的方法set方法去重,并用Array.from转换为数组

set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目,返回一个对象

代码:

Array.prototype.removeDuplicate = function(){
 return (Array.from(new Set(this)));
 }
 var m = arr.removeDuplicate();
 console.log(m);//[1, 2, 3, "我", 34, "我的", NaN]

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
javascript 清除输入框中的数据
Apr 13 Javascript
javascript 三种编解码方式
Feb 01 Javascript
js实现拉伸拖动iframe的具体代码
Aug 03 Javascript
jquery固定底网站底部菜单效果
Aug 13 Javascript
利用jq让你的div居中的好方法分享
Nov 21 Javascript
javascript实现的字符串与十六进制表示字符串相互转换方法
Jul 17 Javascript
通过jquery实现页面的动画效果(实例代码)
Sep 18 Javascript
jquery横向纵向鼠标滚轮全屏切换
Feb 27 Javascript
详谈commonjs模块与es6模块的区别
Oct 18 Javascript
javaScript手机号码校验工具类PhoneUtils详解
Dec 08 Javascript
JavaScript 跨域之POST实现方法
May 07 Javascript
jQuery实现点击滚动到指定元素上的方法分析
Mar 19 jQuery
javascript事件捕获机制【深入分析IE和DOM中的事件模型】
Dec 15 #Javascript
手机软键盘弹出时影响布局的解决方法
Dec 15 #Javascript
JS中页面与页面之间超链接跳转中文乱码问题的解决办法
Dec 15 #Javascript
canvas 画布在主流浏览器中的尺寸限制详细介绍
Dec 15 #Javascript
JavaScript实现Fly Bird小游戏
Dec 15 #Javascript
JS中对数组元素进行增删改移的方法总结
Dec 15 #Javascript
JS去除重复并统计数量的实现方法
Dec 15 #Javascript
You might like
php图片验证码代码
2008/03/27 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
深入理解curl类,可用于模拟get,post和curl下载
2013/06/08 PHP
thinkPHP5框架自定义验证器实现方法分析
2018/06/11 PHP
JavaScript学习笔记(十七)js 优化
2010/02/04 Javascript
jQuery使用load()方法载入另外一个网页文件内的指定标签内容到div标签的方法
2015/03/25 Javascript
使用CoffeeScrip优美方式编写javascript代码
2015/10/28 Javascript
学习JavaScript设计模式之模板方法模式
2016/01/20 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
2016/09/01 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
jQuery删除当前节点元素
2016/12/07 Javascript
js实现点击按钮弹出上传文件的窗口
2016/12/23 Javascript
AngularJS页面带参跳转及参数解析操作示例
2017/06/28 Javascript
JS基于设计模式中的单例模式(Singleton)实现封装对数据增删改查功能
2018/02/06 Javascript
Bootstrap 中data-[*] 属性的整理
2018/03/13 Javascript
vue-router结合vuex实现用户权限控制功能
2019/11/14 Javascript
javascript异常处理实现原理详解
2020/02/17 Javascript
js+canvas实现转盘效果(两个版本)
2020/09/13 Javascript
vue中如何自定义右键菜单详解
2020/12/08 Vue.js
python实现保存网页到本地示例
2014/03/16 Python
Python中unittest用法实例
2014/09/25 Python
Python socket套接字实现C/S模式远程命令执行功能案例
2018/07/06 Python
在unittest中使用 logging 模块记录测试数据的方法
2018/11/30 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
使用python实现微信小程序自动签到功能
2020/04/27 Python
django 连接数据库出现1045错误的解决方式
2020/05/14 Python
HTML5表单验证特性(知识点小结)
2020/03/10 HTML / CSS
世界排名第一的运动鞋市场:Flight Club
2020/01/03 全球购物
《青蛙看海》教学反思
2014/04/23 职场文书
贷款担保申请书
2014/05/20 职场文书
中央空调节能方案
2014/06/15 职场文书
承诺函范文
2015/01/21 职场文书
2015年安全生产月活动总结
2015/03/26 职场文书
2015年全国爱眼日活动方案
2015/05/05 职场文书
Java框架入门之简单介绍SpringBoot框架
2021/06/18 Java/Android
使用HttpSessionListener监听器实战
2022/03/17 Java/Android