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#线程同步--线程通信

    问题抽象:当某个操作的执行必须依赖于另一个操作的完成时,需要有个机制来保证这种先后关系.线程通信方案:ManualResetEventSlim.ManualResetEvent.AutoResetEv ...

  2. IO帮助类

    using System; using System.IO; using System.Web; using System.Drawing; using System.Drawing.Imaging; ...

  3. 环境搭建 - Tomcat(Windows)

    Tomcat环境搭建 本文以Windows7下搭建tomcat-8.5.15为示例 下载tomcat压缩包 网址:Tomcat 非C盘根目录新建文件夹:Tomcat D:\tomcat 将tomcat ...

  4. html5 拖拽上传文件时,屏蔽浏览器默认打开文件

    参考: https://www.cnblogs.com/kingsm/p/9849339.html

  5. 腾讯面试题,js处理1千万条数据排序并且页面不卡顿

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 【20190415】JavaScript-事件流与stopPropagation()、stopImmediatePropagation()的误区解析

    这两天仔细看了一下MDN上关于事件流机制和相关方法的文档,发现有个很大的误区.过去我一直以为stopPropagation()就是用来阻止事件冒泡的,甚至很多博客和菜鸟教程上都是这样写的.但实际上文档 ...

  7. 关于Skyline沿对象画boundingbox的探讨

    先来说说为什么要搞这个?项目中经常遇到的一个操作就是选定对象,以前都是通过Tint设置对象颜色来标识选定对象,但是随着图层中模型增多,模型色彩丰富,会出现选定色与对象颜色对比不明显的情况.因为看到Te ...

  8. shell判断USB接口是否有设备插入

    #/bin/sh usb_num=$(cat /proc/scsi/scsi | grep "Vendor" | wc -l)if [ $usb_num = 2 ];then    ...

  9. MySQL MHA FailOver后,原Master节点自动以Slave角色加入解群的研究与实现

    MHA是一套MySQL高可用管理软件,除了检测Master宕机后,提升候选Slave为New Master之外(漂虚拟IP),还会自动让其他Slave与New Master 建立复制关系.MHA Ma ...

  10. Windows系统XAMPP安装Moodle教程

    一.安装工具下载: 系统环境: Operating System: Windows 10 Enterprise 64-bit (10.0, Build 17134) 集成软件: XAMPP Versi ...