JavaScript实现数组去重的常见方式

1,332 阅读2分钟

JavaScript数组去重的方法

数组去重,一般在面试的时候经常会问到的或者一般是要求手写数组去重方法的代码

一、ES5中最常用的利用for嵌套for,然后splice去重

function unique(arr){            
  for(var i=0; i<arr.length; i++){
    for(var j=i+1; j<arr.length; j++){
      //第一个等同于第二个,splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组
      if(arr[i]==arr[j]){
        arr.splice(j,1);
        j--;
      }
    }
  }
return arr;
}
var arr = [1,2,3,4,5,6,2,4,6,8];
console.log(unique(arr))

二、利用ES6 Set去重(Set是ES6的方法)

function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,2,3,4,5,6,2,4,6,8];
console.log(unique(arr))

不考虑兼容性的话,这种去重的方法代码是最少的,ECMAScript 6 入门

三、利用indexOf去重

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

indexOf()方法如果检索的结果没有匹配值,则返回 -1.

四、利用sort()

var arr = [1,3,4,5,6,7,4,3,2,4,5,6,7,3,2];
function unique2(arr){
  arr.sort();
  var newArr = [arr[0]],
      len = arr.length;
  for(var i = 1; i < len; i++){
    if(arr[i] !== newArr[newArr.length - 1] ){
      newArr.push(arr[i]);
    }
  }
  return newArr;
}
console.log( unique2(arr) );

五、利用对象的属性去重

每次取出原数组的元素,然后再对象中访问这个属性,如果存在就说明重复

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

六、利用数组原型对象上的includes方法

function unique(arr){
 var res = [];
 for(var i=0; i<arr.length; i++){
  if( !res.includes(arr[i]) ){ // 如果res新数组包含当前循环item
   res.push(arr[i]);
  }
 }
 return res;
}
console.log(unique([1,1,2,3,4,5,3,2,3,6,7,4]));