Zusammenfassung der Methoden zur Deduplizierung von JS-Arrays

So deduplizieren Sie JS-Arrays: 1. Verwenden Sie ES6 Set zum Deduplizieren; Die Attribute können nicht dedupliziert werden usw. mit denselben Merkmalen.

Empfohlen: „js-Video-Tutorial“

Array-Deduplizierung tritt normalerweise bei Vorstellungsgesprächen auf und es ist normalerweise 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.

Hinweis: Ich habe es in Eile geschrieben und war in diesen Tagen etwas beschäftigt, daher habe ich es nicht sehr sorgfältig geprüft, aber es gibt kein Problem mit der Idee, vielleicht sind einige kleine Details falsch.

Methode der Array-Deduplizierung

1. Verwenden Sie ES6. Auf Deduplizierung eingestellt (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", {}, {}]

Unabhängig von der Kompatibilität hat diese Deduplizierungsmethode den wenigsten Code. Diese Methode kann keine leeren „{}“-Objekte entfernen, und spätere Methoden auf hoher Ebene werden Methoden hinzufügen, um wiederholte „{}“ zu entfernen.

Zweitens verwenden Sie for zum Verschachteln und dann Spleißen, um Duplikate zu entfernen (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,'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", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]     //NaN和{}没有去重，两个null直接消失了

Doppelstufige Schleife, äußeres Schleifenelement, innerer Schleifenvergleichswert. Bei Gleichheit der Werte wird dieser Wert gelöscht.
Wenn Sie schnell die häufiger verwendete ES6-Syntax erlernen möchten, können Sie meinen vorherigen Artikel „ES6-Notizen lernen – in der Arbeit häufig verwendete ES6-Syntax“ lesen.

3. Verwenden Sie indexOf, um Duplikate zu entfernen. Erstellen Sie ein neues leeres Ergebnisarray, um das ursprüngliche Array zu durchlaufen, und ermitteln Sie, ob das aktuelle Element im Ergebnisarray vorhanden ist. Wenn dies der Fall ist, überspringen Sie es nicht dasselbe, schieben Sie sie in das Array.

4. Verwenden Sie sort()

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;
}
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, "NaN", 0, "a", {…}, {…}]  //NaN、{}没有去重

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

5. Verwenden Sie die Eigenschaft von Objekten, die nicht identisch sein können, um Duplikate zu entfernen (diese Methode zum Deduplizieren von Arrays weist Probleme auf, wird nicht empfohlen und muss verbessert werden)

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;
}
     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))
// [0, 1, 15, "NaN", NaN, NaN, {…}, {…}, "a", false, null, true, "true", undefined]      //NaN、{}没有去重

7

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;
}
    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", 15, false, undefined, null, NaN, 0, "a", {…}]    //两个true直接去掉了，NaN和{}去重

Verwenden Sie hasOwnProperty, um festzustellen, ob ein Objektattribut vorhanden ist.

8. Verwenden Sie den Filter

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array =[];
    for(var i = 0; i < arr.length; i++) {
            if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
                    array.push(arr[i]);
              }
    }
    return array
}
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", {…}, {…}]     //{}没有去重

Vers Das Array, das dedupliziert werden muss, speichert 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. Verwendung von Reduce+includes

function unique(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}
    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", {…}]   //所有的都去重了

12. [...new Set(arr)]

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
    return arr.indexOf(item, 0) === index;
  });
}
    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", 0, "a", {…}, {…}]

PS: Ich persönlich denke, dass sie alle ähnlich sind runter.

Das obige ist der detaillierte Inhalt vonZusammenfassung der Methoden zur Deduplizierung von JS-Arrays. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!