Verschiedene Methoden zur Array-Deduplizierung in Javascript_Javascript-Kenntnissen

Kein weiterer Unsinn, kommen wir direkt zum Praktischen!

Lassen Sie uns zunächst über die Anforderungen dieses Beispiels sprechen: Schreiben Sie eine Methode, um eine Deduplizierung des Arrays zu erreichen. (Anforderungen: Methode ausführen, ein Array übergeben, das neue Array nach der Deduplizierung zurückgeben, das ursprüngliche Array bleibt unverändert, während des Implementierungsprozesses kann nur eine Schleifenschicht verwendet werden, es können auch zweischichtige verschachtelte Schleifen geschrieben werden, nur als Referenz) ;

Lassen Sie mich zunächst Anfängern erklären, was Array-Deduplizierung ist (überspringen für Veteranen): Es bedeutet, doppelte Elemente im Array zu entfernen, zum Beispiel var arr = [3,2,4,2,1,2]; Das durch Deduplizieren des Arrays erhaltene neue Array ist [3,2,4,1], was eine solche Funktion ist.

Die Implementierungsmethode ist relativ einfach und es gibt viele Möglichkeiten, sie umzusetzen. Der Zweck des Schreibens dieses Blogs besteht erstens darin, Anfängern ein besseres Verständnis zu vermitteln Das Prinzip der Implementierung. Schauen wir uns die erste Implementierungsmethode an:

Die erste Methode besteht darin, Duplikate durch Durchlaufen des neuen Arrays zu entfernen

var arr = [1,'b','b',4,3,3,4,5,1];
     
    //第一种
    Array.prototype.unique1 = function(){
      var arr1 = []; //定义一个新数组
      for(var i=0;i<this.length;i++){
        if(arr1.indexOf(this[i]) == -1){//判断目标数组中在原数组里是否存在
          arr1.push(this[i]);
        } 
      } 
      return arr1;
    }
    console.log(arr); //[1,'b','b',4,3,3,4,5,1]
    console.log(arr.unique1()); //[1, "b", 4, 3, 5]
    //这种方法的主要思路就是，新建一个数组，然后在原数组中，从第一个开始，看看新数组里面有没有这个元素，如果有，就忽略，然后进行下一个，如果没有，则把这个元素存到新数组里面，
    //也就是说，每一次比较，都会遍历新数组，直到找到相同元素为止，比较耗性能

Wenn Sie mit dieser Schreibmethode nicht vertraut sind, können Sie sie auf die folgende Schreibmethode ändern, der Effekt ist der gleiche:

var arr = [1,'b','b',4,3,3,4,5,1];

function unique1(arr){
      var arr1 = [];
      for(var i=0;i<arr.length;i++){
        if(arr1.indexOf(arr[i]) == -1){//判断目标数组中在原数组里是否存在
          arr1.push(arr[i]); 
        } 
      } 
      return arr1;
    }
    console.log(arr); //[1,'b','b',4,3,3,4,5,1]
    console.log(unique1(arr)); //[1, "b", 4, 3, 5]

Ich werde die folgende Methode nicht umschreiben, da das Ergebnis das gleiche ist. Nehmen Sie sich Zeit, es zu erleben >

Der zweite Typ wird durch Hash-Tabellen erreicht (dieses Konzept ist etwas umfangreich, die spezifischen Prinzipien werden hier nicht näher erläutert. Ich werde es separat schreiben, wenn ich Zeit habe. Das ist eine gute Sache)

var arr = [1,'b','b',4,3,3,4,5,1];

Array.prototype.unique2 = function(){
      var hash = {}; //定义一个hash表
      var arr1 = []; //定义一个新数组
      for(var i=0;i<this.length;i++){
        /*
          这里比较难理解，我们一步一步来看：
          hash是一个对象，则存在键值对（key：value），只不过现在是为空的,所以hash[key] = value;
          第一步：i=0;this[i]=this[0]=1; hash[this[0]] = hash[1] , 因为hash初始为空，没有找到key=1的值，所以然后undefined，
          执行下一步：hash[1] = true(此时hash对象就有了第一组键值对)，将原数组的第一个数添加到新数组中，重复第一步
          因为不重复的判断hash的值都是undefined，而重复的都为true了,所以不重复都被添加到新数组中
          因为hash表存的值是存的地址，放在堆内存中，所以有多少个不重复的元素，就要分多少个内存来存放，所以这种方法比较占内存，但是相比之下，这种的运算运动是最快的，
          这也就是用空间来换取时间了，数据量比较小，推荐用此方法
        */
        if(! hash[this[i]]){
          hash[this[i]] = true;
          arr1.push(this[i]);
        }
      }
      return arr1;  
    }
    console.log(arr);
    console.log(arr.unique2());

Die dritte Methode wird erreicht, indem überprüft wird, ob die eigene Position konsistent ist

var arr = [1,'b','b',4,3,3,4,5,1];

Array.prototype.unique3 = function(){
      var arr1 = []; //定义一个新数组
      for(var i=0;i<this.length;i++){
        if(this.indexOf(this[i])==i){
        //这里也是indexOf遍历，看从第一个元素在原数组中的位置，如果第一次出现的位置和下标相等，说明当前元素的不重复的，如果不等，说明该元素前面已经出现过
          arr1.push(this[i]);
        }
      }
      return arr1;  
    }
    console.log(arr);
    console.log(arr.unique3());

Die vierte Methode ist etwas interessant und kann nur in besonderen Fällen verwendet werden. Sie besteht darin, zuerst das Array zu sortieren, dann 22 zu vergleichen und ein neues sortiertes Array auszugeben

Array.prototype.unique4 = function(){
      /*
        这里是思路是，先排序（默认从小到大），然后将原数组的第一个给新数组，
        因为是经过排序的，所以重复的只会存在在相邻位置
        这里就相当于是做22比较，如果相等，则进行下一组，如果不相等，则把这个数存到新数组中，用这个数再进行比较
      */
      this.sort();
      var arr1 = [this[0]];
      for(var i=1;i<this.length;i++){
        if(this[i] !== arr1[arr1.length-1]){
          arr1.push(this[i]);
        } 
      }
      return arr1;  
    }
    console.log(arr);
    console.log(arr.unique4());

Wow, machen wir Feierabend!

Die Anforderungen besagen auch, dass es mit einer zweischichtigen verschachtelten Schleife implementiert werden kann. Die andere Möglichkeit besteht darin, eine zweischichtige for-Schleife zu verwenden und jede einzelne mit dem ursprünglichen Array zu vergleichen.

Array.prototype.unique5 = function(){
      //双层循环，一一比较
      for(var i=0;i<this.length;i++){ //从0开始
        for(j= i+1;j<this.length;j++){ //从1开始，逐个比较
          if(this[i] === this[j]){ //如果恒定
            this.splice(j,1);  //就将这个元素删掉
          } 
        } 
      }
      return this;  
    }
    console.log(arr);
    console.log(arr.unique5());

Diese Schreibmethode erfordert zu viele Schleifen und wird nicht empfohlen. Müssen nicht auch die erste und dritte Methode jedes Mal durchlaufen werden? Ja, Sie können es auf diese Weise verstehen, was bedeutet, dass Sie es verstehen, aber es ist kein besonderes Verständnis. Wenn wir sagen, dass es fast dasselbe ist, bedeutet es, dass indexOf () zu unterschiedlich ist, wenn das erste passende Element gefunden wird. es wird

sein

Beenden Sie das Durchlaufen, und Typ 5 durchläuft das gesamte Array, unabhängig davon, ob es gefunden werden kann. Wenn die Datenmenge groß ist, welcher hat Ihrer Meinung nach eine bessere Leistung?

Ein besonderer Hinweis: Wenn Sie zwei Werte vergleichen, die kongruent oder ungleich sind, achten Sie darauf, konstante (===) und nicht konstante (!==) zu verwenden, da dies Elemente in Bezug auf den Typ betrifft, z Beispiel: 1 und '1' sind nicht identisch!

Die oben genannten Informationen sind wirklich trocken, es gibt überhaupt keine Feuchtigkeit, Sie können sich nur darauf verlassen, dass jeder es versteht!