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

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

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

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

  二、优化遍历数组法

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

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

  1. function unique(arr){
  2. var newArr = [];
  3. for(var i = 0; i < arr.length; i++){
  4. for(var j = i+1; j < arr.length; j++){
  5. if(arr[i] == arr[j]){
  6. ++i;
  7. }
  8. }
  9. newArr.push(arr[i]);
  10. }
  11. return newArr;
  12. }
  13. var arr = [1,2,2,3,5,3,6,5];
  14. var newArr = unique(arr);
  15. console.log(newArr);

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

   实现思路:

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

    2.创建一个空对象

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

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

  1. function unique(arr){
  2. var res = [];
  3. var obj = {};
  4. for(var i=0; i<arr.length; i++){
  5. if( !obj[arr[i]] ){
  6. obj[arr[i]] = 1;
  7. res.push(arr[i]);
  8. }
  9. }
  10. return res;
  11. }
  12. var arr = [1,2,2,3,5,3,6,5];
  13. var res = unique(arr)
  14. console.log(res );

  四、ES6 数组去重

   实现思路:

    利用 ES6的set 方法。

  1. function unique(arr){
  2. //Set数据结构,它类似于数组,其成员的值都是唯一的
  3. return Array.from(new Set(arr)); // 利用Array.from将Set结构转换成数组
  4. }
  5.  
  6. var arr = [1,2,2,3,5,3,6,5];
  7. var res = unique(arr)
  8. 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. OpenCV在C#中应用—OpenCVSharp

    1.什么是OpenCVSharp    之前一直是基于OpenCV开发视觉算法,但C++语言对于GUI的开发相对于C#来说确实很不方便,之前就了解到C#下使用OpenCV可以使用EmguCV,这段时间 ...

  2. .net 发布 web应用程序

    第一步:VS2015中发布 https://jingyan.baidu.com/article/7f41ecec58f7eb593c095c69.html (作用:分离开发代码和测试代码) 第二步:发 ...

  3. 【微服务No.2】polly微服务故障处理库

    熔断.降级: 熔断:熔断就是我们常说的“保险丝”,意为当服务出现某些状况时,切断服务,从而防止应用程序不断地常识执行可能会失败的操作造成系统的“雪崩”,或者大量的超时等待导致系统卡死等情况,很多地方也 ...

  4. C-sizeof和strlen区别,以及sizeof如何计算结构体大小

    sizeof和strlen区别 sizeof是关键字,在编译时就能计算出值,可以计算任何类型 strlen是函数,只有在运行时才能去计算,且只能计算字符型的. 对于数组时,strlen是判断’\0’为 ...

  5. 学JAVA第八天,今天用循环做了个好玩的东西

    今天用for循环做了个打印矩形的图案 代码如下: package nf;class Kest{ public static void main(String args[]){ int a=30; in ...

  6. Java开发笔记(四十三)更好用的本地日期时间

    话说Java一连设计了两套时间工具,分别是日期类型Date,以及日历类型Calendar,按理说用在编码开发中绰绰有余了.然而随着Java的日益广泛使用,人们还是发现了它们的种种弊端.且不说先天不良的 ...

  7. shell条件判断if中的-a到-z的意思

    [ -a FILE ]  如果 FILE 存在则为真.  [ -b FILE ]  如果 FILE 存在且是一个块特殊文件则为真.  [ -c FILE ]  如果 FILE 存在且是一个字特殊文件则 ...

  8. 【代码笔记】Web-CSS-CSS Fonts(字体)

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  9. python3.x pool.map方法的实质

    我使用多进程的一般方式,都是multiprocessing模块中的Pool.map()方法.下面写一个简单的示例和解析.至于此种方法使用多进程的效率问题,还希望大佬予以指正. 示例: "&q ...

  10. 小程序的js处理步骤

    <!-- 包含请求路由 --> var hostUrl = require('../../config.js').hostUrl; Page({ <!-- 页面的初始数据 --> ...