1. 程式人生 > >js中8種陣列去重的方法

js中8種陣列去重的方法

第一種:

function deRepeat(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,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
  // var str = arr.join();
console.log(deRepeat(arr));//[1, 2, 34, 23, {a:1},{b:1},[],[]]

indexOf() 方法可返回某個指定元素在陣列中首次出現的位置。如果在陣列中沒找到指定元素則返回 -1。(該方法不支援IE8及更早的IE版本)

第二種

function deRepeat(arr){
     var newArr = [];
     arr.forEach(function(e,index,arr){
        if(arr.indexOf(e)==index){//如果該值是第一次出現,則將其新增到新的陣列中
            newArr.push(e);
        }
     })
     return newArr;
 }
 var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
 console.log(deRepeat(arr));//[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]]

forEach() 方法用於呼叫陣列的每個元素,並將元素傳遞給回撥函式。

array.forEach(function(currentValue, index, arr), thisValue)

引數

引數描述
function(currentValue, index, arr)必需。 陣列中每個元素需要呼叫的函式。
函式引數:
引數描述
currentValue必需。當前元素
index可選。當前元素的索引值。
arr可選。當前元素所屬的陣列物件。
thisValue可選。傳遞給函式的值一般用 "this" 值。
如果這個引數為空, "undefined" 會傳遞給 "this" 值
第三種
 function deRepeat(arr){
     var newArr = arr.filter(function(e,index,arr){
        return arr.indexOf(e)==index;
     })
     return newArr;
 }
 var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
 console.log(deRepeat(arr));//[1,2,34,23,{a:1},{b:1},[],[]]

主要利用的是陣列中的filter方法,filter() 方法建立一個新的陣列,新陣列中的元素是通過檢查指定陣列中符合條件的所有元素。

filter()方法的用法和forEach()方法差不多,此處就不再詳細贅述了。

第四種

function deRepeat(arr){
    var newArr=[];
    var temp;
    arr.sort();
    newArr.push(arr[0]);
    for(var i=1; i<arr.length;i++){
        if(arr[i]!=temp){
            newArr.push(arr[i]);
            temp= arr[i];
        }
    }
    return newArr;
}
 var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
 console.log(deRepeat(arr));//[[],[],1,2,23,34,{a:1},{b:1}]

利用陣列的排序方法,先將陣列進行排序,然後與temp進行比較

第五種

function deRepeat(arr){
    for(var i=0; i<arr.length; i++){
        for(var j=i+1;j<arr.length;j++){
            if(arr[i]==arr[j]){
                arr.splice(j,1);
                j--;
            }
        }
    }
    return arr;
}
 var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
 console.log(deRepeat(arr));//[1,2,34,23,{a:1},{b:1},[],[]]
利用陣列中的splice()方法,以及for迴圈的巢狀
第六種
function deRepeat(arr){
    let newArr=[];
    const set = new Set(arr);
    newArr = [...set];
    return newArr;
}
 var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
 console.log(deRepeat(arr));//[1,2,34,23,{a:1},{b:1},[],[]]

主要利用的是ES6中的set資料結構(由一組無序且唯一的項組成),以及擴充套件運算子...

第七種,主要利用ES6中的set資料結構,以及Array.from()方法

function deRepeat(arr) {
  return Array.from(new Set(array));
}
var arr = []
console.log(deRepeat([1, 1, 2, 3])) // 
Array.from()方法可以將 Set 結構轉為陣列。

第八種,遍歷陣列,利用object物件儲存陣列值,判斷陣列值是否已經儲存在object中,未儲存則push到新陣列並用object[arrayItem]=1的方式記錄儲存

但是隻適合陣列中是基本資料型別的情況,對於數組裡面是引用型別資料的情況不適用,看下面的列印結果就知道了

function deRepeat(arr){
      var obj = {};
      var newArr = [];
      for(var i=0;i<arr.length;i++){
          if(!obj[arr[i]]){
              obj[arr[i]] = 1;
              newArr.push(arr[i]);
          }
      }
      return newArr;
  }
  var arr=[1,2,1,2,34,2,23,23,23,{a:1},{b:1},[],[]];
  console.log(deRepeat(arr));//[1, 2, 34, 23, {a:1},[]]