JavaScript数组去重,翻来覆去太常用,适合新手!

·  阅读 190

首先在做数组去重的时候,我们要自己创建一个数组,这个就按照自己的想法去创建就ok啦! 紧接着,我们先来总结一下,JS中常用的几种去重方法:indexOf方法、调用indexOf方法、排序后相邻去除法、优化遍历数组法、ES6实现...

以下就是我们随意创建的一个数组

var ary = [1, 3, 2, 2, 3, 5, 1, 15, 51, 41, 214, 51, 5, 45, 15, 4, 854, 5, 6]
复制代码

indexOf方法

遍历去要重的数组,当值不在新数组的时候(indexOf为-1)就加入该新数组中。

function unique1(arr){
  var temp=[];
  for (var i = 0; i < arr.length; i++) {
     if(temp.indexOf(arr[i])==-1){
     temp.push(arr[i]);
     }
  }
  return temp;
}
复制代码

调用indexOf方法

如果当前数组的第 i 项在当前数组中第一次出现的位置不是 i,那么表示第 i 项是重复的,忽略掉。否则存入结果数组。

function unique2(arr){
  var temp=[];
  for (var i = 0; i < arr.length; i++) {
     if(arr.indexOf(arr[i])==i){
      temp.push(arr[i]);
     }
  }
  return temp;
}
复制代码

利用indexOf 和 lastIndexOf 去重

function unique3(arr) {
    //若indexOf和lastIndexOf得到的值不一样,说明后边有重复的项
    for (var i = 0; i < ary.length; i++) {
        var n = arr.indexOf(arr[i]),
            m = arr.lastIndexOf(arr[i]);
        if (n !== m){
            arr.splice(m,1);
            //n和m不相同,说明m为重复项,只需删除即可。删除后仍需对比,
            i--;
        }
    }
    return arr;
}   
复制代码

双for循环(优化遍历数组法)

去掉数组中的重复项splice()
 
for (var i = 0; i < ary.length; i++) {
    var temp = ary[i];
    
    for (var j = i + 1; j < ary.length; j++) {
        if (temp === ary[j]) {
            ary.splice(j, 1); 
            //数组塌陷.splice 会改变数组长度,所以要将下标 j 减一
            j--;
        }
    }
}
复制代码

利用对象的属性名不能重复

function unique2(arr) {
    var obj = {};
    arr.forEach(function (v) {
        obj[v] = v ;
        // obj[1] = 1;假如v代表的是1,给obj增加一个属性名是1,属性值也是1的一个键值对
    })
    console.log(obj);
        // 把对象中存储的键值对儿拿出来放到新数组中,然后把新数组返回;
    var arr = [];
    for (var k in obj) {
        arr.push(obj[k])
    }
    return arr;
}
复制代码

排序后相邻去除法

给传入的数组排序,排序后相同的值会相邻,然后遍历排序后数组时,新数组只加入不与前一值重复的值。

function unique3(arr){
  arr.sort();
  var temp=[arr[0]];
  for (var i = 1; i < arr.length; i++) {
     if(arr[i]!=temp[temp.length-1]){
      temp.push(arr[i]);
     }
  }
  return temp;
}
复制代码

ES6实现

ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。 Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化。

    function unique5(arr){
      var x = new Set(arr);
     return [...x];
    }
复制代码

. . . . .

分类:
前端
标签: