JS 常见的几种数组去重方法

  一、最简单方法(indexOf 方法)

   实现思路:新建一个数组,遍历要去重的数组,当值不在新数组的时候(indexOf 为 -1)就加入该新数组中;

function unique(arr){
var newArr = [];
for(var i = 0; i < arr.length; i++){
if(newArr.indexOf(arr[i]) == -1){
newArr.push(arr[i])
}
}
return newArr;
} var arr = [1,2,2,3,4,4,5,1,3];
var newArr = unique(arr);
console.log(newArr);

  二、优化遍历数组法

   实现思路:双层循环,外循环表示从0到arr.length,内循环表示从i+1到arr.length,

          将没重复的右边值放入新数组。(检测到有重复值时终止当前循环同时进入外层循环的下一轮判断)

function unique(arr){
var newArr = [];
for(var i = 0; i < arr.length; i++){
for(var j = i+1; j < arr.length; j++){
if(arr[i] == arr[j]){
++i;
}
}
newArr.push(arr[i]);
}
return newArr;
}
var arr = [1,2,2,3,5,3,6,5];
var newArr = unique(arr);
console.log(newArr);

  三、利用对象的属性不能相同的特点进行去重(推荐使用)

   实现思路:

    1.创建一个新的数组存放结果

    2.创建一个空对象

    3.for循环时,每次取出一个元素与对象进行对比,如果这个元素不重复,则把它存放到结果数组中,同时把这个元素的内容作为对象的一个属性,并赋值为1,存入到第2步建立的对象中。

    说明:至于如何对比,就是每次从原数组中取出一个元素,然后到对象中去访问这个属性,如果能访问到值,则说明重复。

function unique(arr){
var res = [];
var obj = {};
for(var i=0; i<arr.length; i++){
if( !obj[arr[i]] ){
obj[arr[i]] = 1;
res.push(arr[i]);
}
}
return res;
}
var arr = [1,2,2,3,5,3,6,5];
var res = unique(arr)
console.log(res );

  四、ES6 数组去重

   实现思路:

    利用 ES6的set 方法。

function unique(arr){
//Set数据结构,它类似于数组,其成员的值都是唯一的
return Array.from(new Set(arr)); // 利用Array.from将Set结构转换成数组
} var arr = [1,2,2,3,5,3,6,5];
var res = unique(arr)
console.log(res );
随笔参考 https://www.jb51.net/article/121410.htm
感谢博主分享!

JS 数组去重的几种方式的更多相关文章

  1. js 数组去重的几种方式及原理

    let arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,' ...

  2. js数组去重的三种方式的比较

    做前端的,一般实现功能是主要的,但是重中之重却是在做到功能完善的情况下提高性能. 1.遍历数组法 实现的思路:构建一个新的数组存放结果,for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组 ...

  3. js数组去重的四种方式

    // 删除重复的 function only(arr){ for(var i=0;i<arr.length;i++){ for(var j = i+1;j<arr.length;j++){ ...

  4. JS数组去重的几种常见方法

    JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...

  5. js数组去重的4种方法

    js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法 贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill Array.prototype.inde ...

  6. JS数组去重的6种算法实现

    1.遍历数组法 最简单的去重方法,实现思路:新建一新数组,遍历传入数组,值不在新数组就加入该新数组中:注意点:判断值是否在数组的方法"indexOf"是ECMAScript5 方法 ...

  7. JavaScript数组去重的7种方式

    1.利用额外数组 function unique(array) {    if (!Array.isArray(array)) return;     let newArray = [];    fo ...

  8. JS数组去重的9种方法(包括去重NaN和复杂数组类型)

    其实网上已经有很多js数组的去重方法,但是我看了很多篇并自己通过代码验证,发现都有一些缺陷,于是在研究多篇代码之后,自己总结了9种方法,如果有哪里不对请及时纠正我哈~ 转载请表明出处 测试代码 let ...

  9. js数组去重的几种方法

    1.遍历数组法 最简单的去重方法, 实现思路:新建一新数组,遍历传入数组,值不在新数组就加入该新数组中:注意点:判断值是否在数组的方法“indexOf”是ECMAScript5 方法,IE8以下不支持 ...

随机推荐

  1. C# 在PPT幻灯片中创建图表

    图表能够很直观的表现数据在某个时间段的变化趋势,或者呈现数据的整体和局部之间的相互关系,相较于大篇幅的文本数据,图表更增加了我们分析数据时选择的多样性,是我们挖掘数据背后潜在价值的一种更为有效地方式. ...

  2. web前端图片上传

    图片上传有很多种形式,但是听说ios只能传字符串,所以为了安卓.ios和web能用一个接口上传图片,采用了基于base64 的方法上传图片. 下面是我的html <div class=" ...

  3. react 阻止事件冒泡

    前言 在学习react阻止事件冒泡,需要先了解 合成事件 和 原生事件 合成事件:在jsx中直接绑定的事件,就是合成事件: 原生事件: 通过js原生代码绑定的事件,就是原生事件: react事件:re ...

  4. Vue-指令

    1. v-text:这个指令用于将vue实例中的data内的属性渲染到标签内.有两种写法: 1. `<div v-text="数据"></div>`:该写法 ...

  5. java StringBuilder 和 StringBuffer

    1, 相对于 String 来说, StringBuilder 和 StringBuffer 均是可变的 2, StringBuilder 线程不安全, StringBuffer 线程安全 3, 运行 ...

  6. OpenTK学习笔记

    OpenGL定义 OpenGL被定义为"图形硬件的一种软件接口".实质上是3D图形和模型库,具有高度可移植性,具有非常快的速度. OpenGL架构 术语pipeline常用于阐述彼 ...

  7. Android 简单实现控件的拖动

    控件的拖动,使用到一个监听事件 setOnTouchListener:XML代码: <?xml version="1.0" encoding="utf-8" ...

  8. Android PAI (PlayAutoInstall)预装APK 功能

    最近刚找到工作,是手机方案公司,刚接触手机系统预装的APP,以及解决方案MTK平台下预装APP的bug,也接触到了Launcher的东西. 然后接触到了第一个需求 PAI预装APK功能 下面是我用到的 ...

  9. SQL增删改查

    1.增 INSERT INTO table_name VALUES (value1, value2,....) INSERT INTO table_name (列1, 列2,...) VALUES ( ...

  10. c/c++ 多线程 一个线程等待某种事件发生

    多线程 一个线程等待某种事件发生 背景:某个线程在能够完成其任务之前可能需要等待另一个线程完成其任务. 例如:坐夜间列车,为了能够不坐过站, 1,整夜保持清醒,但是这样你就会非常累,不能够睡觉. 2, ...