Eine äußerst umfassende Zusammenfassung von 12 Methoden zum Entfernen von Duplikaten aus JavaScript-Arrays

Dieser Artikel bietet Ihnen eine Zusammenfassung von 12 äußerst umfassenden JavaScript-Array-Deduplizierungsmethoden. Ich hoffe, dass er Ihnen als Referenz dienen wird.

Array-Deduplizierung tritt normalerweise bei Interviews auf. Normalerweise ist es erforderlich, den Code der Array-Deduplizierungsmethode handschriftlich zu schreiben. Wenn Sie gefragt werden: Welche Methoden gibt es zum Deduplizieren von Arrays? Wenn Sie zehn davon beantworten können, wird der Interviewer wahrscheinlich von Ihnen beeindruckt sein.
Array-Deduplizierung, die in realen Projekten auftritt, wird normalerweise im Hintergrund verarbeitet, und das Front-End wird selten zur Verarbeitung der Array-Deduplizierung verwendet. Obwohl die Wahrscheinlichkeit, dass es in alltäglichen Projekten verwendet wird, relativ gering ist, müssen Sie es dennoch wissen, falls Sie im Vorstellungsgespräch danach gefragt werden.

Methoden zum Deduplizieren von Arrays

1. Verwenden Sie ES6 Set zum Deduplizieren (am häufigsten in ES6 verwendet)

function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
 //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]

Berücksichtigen Sie nicht die Kompatibilität Die Deduplizierungsmethode hat den geringsten Code. Diese Methode kann das leere Objekt „{}“ nicht entfernen. Spätere Methoden höherer Ordnung können das leere Objekt „{}“ hinzufügen und entfernen.

2. Zum Verschachteln verwenden und dann zum Entfernen von Duplikaten verbinden (am häufigsten in ES5 verwendet)

function unique(arr){            
        for(var i=0; i<arr.length; i++){
            for(var j=i+1; j<arr.length; j++){
                if(arr[i]==arr[j]){         //第一个等同于第二个，splice方法删除第二个
                    arr.splice(j,1);
                    j--;
                }
            }
        }
return arr;
}
var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
    console.log(unique(arr))
    //[1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]

Doppelschichtige Schleife, äußeres Schleifenelement, inneres Schleife Werte vergleichen. Bei Gleichheit der Werte wird dieser Wert gelöscht.
Wenn Sie schnell mehr über die am häufigsten verwendete ES6-Syntax erfahren möchten, können Sie meinen vorherigen Artikel „Lernen von ES6-Notizen – In der Arbeit häufig verwendete ES6-Syntax“ lesen.

3. Verwenden Sie indexOf, um Duplikate zu entfernen

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array .push(arr[i])
        }
    }
    return array;
}

Erstellen Sie ein neues leeres Ergebnisarray, for-Schleifen Sie das ursprüngliche Array und bestimmen Sie, ob das aktuelle Element im Ergebnisarray vorhanden ist Wenn es dieselben Werte gibt, werden sie übersprungen und in das Array verschoben.

4. Verwenden Sie sort()

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return;
    }
    arr = arr.sort()
    var arrry= [arr[0]];
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] !== arr[i-1]) {
            arrry.push(arr[i]);
        }
    }
    return arrry;
}

Verwenden Sie die Sortiermethode sort() und durchlaufen und vergleichen Sie dann benachbarte Elemente basierend auf den sortierten Ergebnissen.

5. Verwenden Sie die Eigenschaften von Objekten, die nicht identisch sein können, um Duplikate zu entfernen

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var arrry= [];
     var  obj = {};
    for (var i = 0; i < arr.length; i++) {
        if (!obj[arr[i]]) {
            arrry.push(arr[i])
            obj[arr[i]] = 1
        } else {
            obj[arr[i]]++
        }
    }
    return arrry;
}

6. Die Verwendung umfasst

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var arrry=[];
    for(vari = 0; i < arr.length; i++) {
            if( !arrry.includes( arr[i]) ) {//includes 检测数组是否有某个值
                    arrry.push(arr[i]);
              }
    }
}

7. Verwenden Sie hasOwnProperty

function unique(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}

Verwenden Sie hasOwnProperty, um festzustellen, ob Objekteigenschaften vorhanden sind

8. Verwenden Sie den Filter

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
    return arr.indexOf(item, 0) === index;
  });
}

9 , Verwenden Sie Rekursion zum Deduplizieren

function unique(arr) {
        var arrry= arr;
        var len = arrry.length;

    arrry.sort(function(a,b){   //排序后更加方便去重
        return a - b;
    })

    function loop(index){
        if(index >= 1){
            if(arrry[index] === arrry[index-1]){
                arrry.splice(index,1);
            }
            loop(index - 1);    //递归loop，然后数组去重
        }
    }
    loop(len-1);
    return arrry;
}

10. Verwenden Sie die Kartendatenstruktur zum Deduplizieren

function arrayNonRepeatfy(arr) {
  let map = new Map();
  let array = new Array();  // 数组用于返回结果
  for (let i = 0; i < arr.length; i++) {
    if(map .has(arr[i])) {  // 如果有该key值
      map .set(arr[i], true); 
    } else { 
      map .set(arr[i], false);   // 如果没有该key值
      array .push(arr[i]);
    }
  } 
  return array ;
}

Erstellen Sie eine leere Kartendatenstruktur und durchlaufen Sie das Array Das muss dedupliziert werden. Speichern Sie jedes Element des Arrays als Schlüssel in der Map. Da in der Karte nicht derselbe Schlüsselwert angezeigt wird, ist das Endergebnis das Ergebnis nach der Deduplizierung.

11. Mit Reduce

Array.prototype.unique = function() {
  var sortArr = this.sort();
  var array = [];
  sortArr.reduce((s1,s2) => {
    if(s1 !== s2){
      array .push(s1);
    }
    return s2;
  })
  array .push(sortArr[sortArr.length - 1]);
  return array ;
}

12. In einigen Artikeln wurde die Array-Deduplizierungsmethode foreach+indexOf erwähnt. Ich persönlich denke, dass sie alle ähnlich sind, deshalb habe ich sie nicht aufgeschrieben.

Das obige ist der detaillierte Inhalt vonEine äußerst umfassende Zusammenfassung von 12 Methoden zum Entfernen von Duplikaten aus JavaScript-Arrays. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!