zoukankan      html  css  js  c++  java
  • JavaScript中数组去重的几种方法

    JavaScript中数组去重的几种方法

    正常情况下,数据去重的工作一般都是由后端同事来完成的,但是前端也要掌握好处理数据的能力,万一去重的工作交给我们大前端处理,我们也不能怂呀。现在我总结了一些去重的方法,希望对大家有点帮助。

    方法一:new Set()实现数组去重

    ES6 提供了新的数据结构 Set,它类似于数组,但是成员的值都是唯一的,没有重复的值。 Set 本身是一个构造函数,用来生成 Set 数据结构。Set函数可以接受一个数组,用于初始化。根据 Set的数据特性,我们可以实现数组去重。

    let list = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
    let list1 = Array.from(new Set(list)); //  [ 1, "a", true, false, null, "", undefined ]
    let list2 = [...new Set(list)]; //  [ 1, "a", true, false, null, "", undefined ]
    

    方法二:some()+循环去重

    some() 方法用于检测数组中的元素是否满足指定条件(函数提供) 。 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。 如果没有满足条件的元素,则返回false。 我们可以定义一个新数组来承接没有重复的数据,遍历原始数组的时候,用新数组来判断数据是否已经出现过。

     function distinct(list) {
         let result = [list[0]];// 用于承接没有重复的数据,初始时将原始数组的第一个值赋给它。
         for (let i = 1; i < list.length; i++) {
             // 判断结果数组中是否存在一样的值,若果没有的话则将数据存入结果数组中。
             if (!(result.some(val => list[i] === val))) {
                 result.push(list[i]);
             }
         }
         return result;
     }
    let arr = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
    distinct(arr); // [ 1, "a", true, false, null, "", undefined ]
    

    方法三:双重for循环去重

    双重for循环,第一层循环确保数组中的每一项都能被比较,第二层循环确保被比较项后的每一项都能跟被比较项比较。

    function distinct2(list) {
        for (let i = 0; i < list.length; i++) {
            for (let j = i + 1; j < list.length; j++) {
                // 后面数据的若跟前一项数据相同,则重复,需要去除。
                if (list[i] === list[j]) {
                    list.splice(j, 1); // 去除后面的相同项
                    j--;
                }
            }
        }
        return list;
    }
    let arr = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
    distinct2(arr); // [ 1, "a", true, false, null, "", undefined ]
    

    方法四:hasOwnProperty()方法去重

    hasOwnProperty() 方法用来检测一个属性是否是对象的自有属性,而不是从原型链继承的。如果该属性是自有属性,那么返回 true,否则返回 false。

    function unique(arr) {
      var obj = {}; // 用来记录数组中的数据
      return arr.filter(function(item, index, arr){
          // 如果记录对象中存在某个数据,则返回false过滤掉;否则obj进行记录并筛选出来
          return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
      })
    }
    let arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    unique(arr) //  [ 1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, 'a', {}]
    

    方法五:利用filter()+indexOf()方法去重

    indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

    function unique(arr) {
      return arr.filter(function(item, index, arr) {
        // 从数组0位开始查,如果当前元素在原始数组中的第一个索引==当前索引值,说明它是第一次出现。
        return arr.indexOf(item, 0) === index;
      });
    }
    let list = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
    unique(list); //  [ 1, "a", true, false, null, "", undefined ]
    

    此外,数组去重还可以利用filter()、includes()等方法实现,但是思路都跟上面几种方法类似,这里就不一一列举了。

  • 相关阅读:
    hdu2328 Corporate Identity
    hdu1238 Substrings
    hdu4300 Clairewd’s message
    hdu3336 Count the string
    hdu2597 Simpsons’ Hidden Talents
    poj3080 Blue Jeans
    poj2752 Seek the Name, Seek the Fame
    poj2406 Power Strings
    hust1010 The Minimum Length
    hdu1358 Period
  • 原文地址:https://www.cnblogs.com/laozhenHome/p/13232504.html
Copyright © 2011-2022 走看看