Wie finde ich das häufigste Element eines Arrays? [Aktualisierte]

Die Leute haben sich über Leistungsprobleme mit der alten Methode beschwert. Aus diesem Grund habe ich diesen Artikel mit Hashmap auf die leistungsstärkste Methode aktualisiert.

Wie finde ich das häufigste Element eines Arrays in JavaScript? Etwas, das viele Entwickler nur schwer herausfinden können. Es gibt zwar viele Lösungen, aber die meisten sind zu kompliziert und schwer zu verstehen.

Leute suchen:
Wie man,,,
 "Holen Sie sich das Element mit dem höchsten Vorkommen in einem Array"
"Holen Sie sich das Element, das am häufigsten in einem Array angezeigt wird"
"Schreiben Sie eine Funktion, um die Anzahl der häufigsten Elemente eines Arrays zu ermitteln."

Das heißt, es gibt viele Leute, die nach der besten und einfachsten Lösung suchen, um herauszufinden, wie man das häufigste Element eines Arrays erhält.

Also, heute werde ich genau das zeigen. "Also fangen wir an"

Schritt 1

Zuerst müssen wir ein Array erstellen.

var cats = ['Tom', 'Fluffy', 'Tom', 'Bella', 'Chloe', 'Tom', 'Chloe'];

Jetzt haben wir unsere Auswahl an Katzen.

Schritt 2

Wir brauchen eine Funktion, die unser Array als Argument verwendet und die Berechnung durchführt. Denken Sie daran! Wir können die gesamte Berechnung auch ohne Funktion durchführen. Es ist alles nur eine Frage der Präferenz. In diesem Beispiel gehe ich mit iife (sofort aufgerufener Funktionsausdruck).

(function (array) {
  // Code geht hier rein
}) ();

Schritt 3

Jetzt erstellen wir drei (3) Variablen, eine zum Speichern unserer Hashmap, die andere zum Vergleichen des alten Werts mit dem nächsten Wert und die letzte zum Speichern des letzten, häufigsten Werts im Array.

(function (array) {
  var counts = {}; // Wir werden das Auftreten von Gegenständen hier zählen
  var compare = 0; // Wir vergleichen mit dem gespeicherten Wert
  var mostFrequent; // Wir werden den häufigsten Artikel lagern
}) ();

Schritt 4

Jetzt ist es an der Zeit, eine Schleife innerhalb unserer Funktion zu erstellen, um alle Berechnungen durchzuführen.

// caching length in len variable
für (var i = 0, len = cats.length; i 
      if (zählt [wort]> vergleiche) {// zählt [wort]> 0 (erstes mal)
         compare = zählt [word]; // setze compare to counts [word]
         mostFrequent = Katzen [i]; // setze den häufigsten Wert
      }
 }

Wenn der obige Code für einige von Ihnen kompliziert ist, lassen Sie es mich erklären.

  1. Zuerst starten wir eine Schleife, die so lange läuft, wie "i - ist weniger als die Länge des Katzenarrays".
  2. In dieser Schleife speichern wir dann das erste Element des Katzenarrays in der Variablen "word". Jetzt prüfen wir, ob das Objekt "count" ein Element enthält, unabhängig davon, welcher Wert in Word gespeichert ist. Wenn dies nicht der Fall ist, setzen wir den Wert "count [word]" auf 1.
    Zum Beispiel:
    Wenn, Wort = "Tom", dann zählt ["Tom"] = 1; wird gesetzt, wenn die Anzahl [word] nicht existiert.
  3. Wenn nun in der nächsten Iteration Anzahl ["Tom"] vorhanden ist, erhöhen wir den Wert um 1. Dies entspricht Anzahl ["Tom"] = Anzahl ["Tom"] + 1;
    Ausgabe:
    [zählt [“Tom”] Wert ist jetzt 1] ,,,
    zählt ["Tom"] = 1 + 1; Jetzt wird das Objekt so aussehen, wie es zählt. {Tom: 2}
  4. Wenn nun in der nächsten Iteration keine Anzahl ["Fluffy"] vorhanden ist, wird "undefined" ausgegeben. Dies bedeutet, wenn die Bedingung wahr ist, wird sie in das Zählobjekt eingefügt.
    Ausgabe:
    zählt ["Fluffy"] = 1;
    Jetzt sieht das Objekt wie folgt aus: ,,, counts = {Tom: 2, Fluffy: 1};
  5. Der gleiche Vorgang wird für jedes Element wiederholt. Wenn es nicht vorhanden ist, fügen Sie es hinzu und erhöhen Sie den Wert um 1.
  6. Lassen Sie uns nun über die zweite if-Anweisung sprechen.
  7. In der zweiten if-Anweisung prüfen wir, ob counts [word] größer ist als der Vergleichswert, der am Anfang unserer Schleife "0" ist.
  8. Da count [“Tom”] “2” ausgibt und “2” größer als 0 ist, ist Condition true und der Code in der if-Anweisung wird ausgeführt.
  9. In der if-Anweisung prüfen wir, ob counts [word] ,,, counts [“Tom”]> 0 ist, und setzen dann den Wert von compare auf counts [“Tom”] ,,, wie wir jetzt wissen, zählt [“Tom” ] ist "2".
  10. Daher wird "2" in der Vergleichsvariablen gespeichert.
  11. Und in mostFrequent-Variablen ist der Name des Elements größer als compare.
  12. Jetzt prüfen wir in der nächsten Iteration, ob count ["Fluffy"] größer ist als compare ,,, hier ist der Vergleichswert "2".
  13. Wenn count ["Fluffy"] jetzt "3" ist, wird der Vergleichswert auf "3" gesetzt, und weil "Fluffy" größer als "compare" ist. "Fluffy" wird in mostFrequent-Variable gespeichert.

Dieser Vorgang wird wiederholt, bis die Schleife mit der Variablen "i" fehlschlägt.

Am Ende erhalten wir unseren häufigsten Artikelwert in der Variablen mostFrequent. das wird so aussehen ,,,

mostFrequent = 3

Jetzt müssen wir nur noch überprüfen, was in der Variable mostFrequent gespeichert ist.

console.log (cats [mostFrequent]);

Schritt 5

Das letzte Stück lässt unsere gesamte Schleife in unser Leben einschließen - (sofort aufgerufene Funktionsausdrücke).

var cats = ['Tom', 'Fluffy', 'Tom', 'Bella', 'Chloe', 'Tom', 'Chloe'];
var counts = {};
var compare = 0;
var mostFrequent;
(function (array) {
   für (var i = 0, len = array.length; i  compare) {
             compare = zählt [word];
             mostFrequent = Katzen [i];
       }
    }
  return mostFrequent;
}) (Katzen);
Hinweis: Ich habe cats.length in array.length geändert, da dies nun unser Funktionsargument ist, das dem unseres cats-Arrays entspricht.

Nun, das ist es. So finden Sie das häufigste Element in einem Array.

Performance?? Nun, ich habe dieses Beispiel mit einem anderen Beispiel getestet, bei dem mithilfe von "Reduzieren" dieselben Ergebnisse erzielt werden. Diese Methode ist jedoch performanter als "Reduzieren", obwohl sie dieselben Ergebnisse erzielt.

Überprüfen Sie den Leistungstestfall hier: Klicken Sie hier

Wenn das obige Beispiel immer noch kompliziert ist, können Sie es gerne kommentieren oder mich über || kontaktieren Twitter: @AmJustSam

Wenn Sie meinen vorherigen Artikel über das vertikale Zentrieren in CSS nicht gelesen haben, finden Sie hier den Link - HIER KLICKEN

Wenn Ihnen der Inhalt gefällt, können Sie diesen Artikel gerne weiterempfehlen, damit auch andere davon profitieren!