Zusammenfassung und Vergleich mehrerer Array-Traversal-Methoden in JS

Dieses Mal werde ich mehrere JS-Array-Traversal-Methoden zusammenfassen und vergleichen. Welche Vorsichtsmaßnahmen werden mit mehreren JS-Array-Traversal-Methoden zusammengefasst und verglichen? sehen.

Vorwort

Dieser Artikel gehört zur gleichen Reihe wie der vorherige Artikel über mehrere JS-Variablenaustauschmethoden und den Vergleich der Leistungsanalyse. Dieser Artikel wird fortgesetzt die Analyse. Mehrere häufig verwendete Array-Traversal-Methoden in JS und ihre jeweiligen Leistungsvergleiche

ab

Zuletzt haben wir mehrere analysiert Häufig verwendete Variablen in JS Nachdem ich die Methoden und ihre jeweiligen Leistungen ausgetauscht hatte, hatte ich das Gefühl, dass diese Methode recht gut war, also extrahierte ich die Kernlogik, kapselte sie in eine Vorlage und plante, sie zu einer Serie zu erweitern. Dieser Artikel ist der zweite Artikel in der Reihe, eine Analyse und ein Vergleich von JS-Array-Traversal-Methoden

Mehrere Möglichkeiten des JS-Array-Traversal

JS-Array-Traversal, grundsätzlich für , forin, foreach, forof, map usw. Im Folgenden werden verschiedene Array-Traversal-Methoden vorgestellt, die in der Analyse dieses Artikels sowie in der Leistungsanalyse und im Vergleich verwendet werden

Der erste Typ: gewöhnliche for-Schleife

Der Code lautet wie folgt:

for(j = 0; j < arr.length; j++) {
}

Kurze Beschreibung: Der einfachste und am häufigsten verwendete Code. Obwohl die Leistung nicht schwach ist, gibt es noch Raum für Optimierung

Der zweite Typ: optimierte Version der for-Schleife

Der Code lautet wie folgt:

for(j = 0,len=arr.length; j < len; j++) {
}

Kurze Beschreibung: Verwenden Sie temporäre Variablen, um die Länge zwischenzuspeichern, um ein wiederholtes Abrufen der zu vermeiden Array-Länge Der Optimierungseffekt wird deutlicher, wenn das Array größer ist.

Diese Methode ist im Grunde die leistungsstärkste unter allen Schleifendurchlaufmethoden

Der dritte Typ: abgeschwächte Version der for-Schleife

Der Code lautet wie folgt :

for(j = 0; arr[j]!=null; j++) {
}

Kurze Beschreibung: Diese Methode ist eigentlich eine reine for-Schleife, verwendet jedoch nicht die Längenbeurteilung, sondern die Variable selbst zur Beurteilung

Tatsächlich die Leistung dieser Methode ist viel kleiner als die gewöhnliche for-Schleife

Der vierte Typ: foreach-Schleife

Der Code lautet wie folgt:

arr.forEach(function(e){
});

Kurze Beschreibung: Die foreach Schleife, die mit dem Array geliefert wird, wird häufiger verwendet und ist tatsächlich schwächer als die gewöhnliche for-Schleife

Der fünfte Typ: foreach-Variante

Der Code lautet wie folgt:

Array.prototype.forEach.call(arr,function(el){
});

Kurze Beschreibung: Da foreach mit dem Array-Typ geliefert wird, können einige nicht zu diesem Typ gehörende Typen nicht direkt verwendet werden (z. B. NodeList), sodass diese Variante erstellt werden kann. Die Verwendung dieser Variante kann ähnliche Arrays ermöglichen die foreach-Funktion haben.

Die tatsächliche Leistung ist schwächer als bei gewöhnlichem foreach

Der sechste Typ: Forin-Schleife

Der Code lautet wie folgt:

for(j in arr) {
}

Kurze Beschreibung: Viele Leute verwenden diese Schleife gerne, aber nach Analyse und Tests ist ihre Effizienz unter den vielen Schleifendurchlaufmethoden

am niedrigsten

Siebtens: Karte Durchquerung

Der Code lautet wie folgt:

arr.map(function(n){
});

Kurze Beschreibung: Diese Methode ist zwar ebenfalls weit verbreitet, aber die tatsächliche Effizienz ist nicht so gut wie bei foreach

Achter Typ: forof traversal (erfordert ES6-Unterstützung)

Der Code lautet wie folgt:

for(let value of arr) {
});

Kurze Beschreibung: Diese Methode wird in es6 verwendet , und seine Leistung ist besser als bei Forin, aber immer noch nicht so gut wie die gewöhnliche for-Schleife

Leistungsvergleich verschiedener Traversalmethoden

Oben sind mehrere Methoden aufgeführt. Nachdem wir eine vergleichende Analyse durchgeführt haben, können wir grundsätzlich zu folgendem Schluss kommen:

Die gewöhnliche for-Schleife ist die eleganteste

(PS : Alle oben genannten Codes führen lediglich eine leere Schleife aus, es gibt keinen internen Ausführungscode in der Schleife, analysieren Sie einfach die Zeit jeder Schleife)

Screenshot zum Leistungsvergleich

Analyseergebnis 1

Die Daten im Screenshot unten sind die Schlussfolgerung, die nach 100-maliger Ausführung in Chrome (unterstützt es6) gezogen wurde (jeweils 10-malige Ausführung, insgesamt 10 Schleifen, Analyseergebnisse)

Es ist ersichtlich, dass die Forin-Schleife am langsamsten ist. Die optimierte gewöhnliche for-Schleife ist am schnellsten

Analyseergebnis 2

Die folgenden Screenshot-Daten sind die Schlussfolgerung nach 1000-maliger Ausführung in Chrome (unterstützt es6) (Run 100 Mal, insgesamt 10 Zyklen, die erhaltenen Analyseergebnisse)

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie unter Bitte achten Sie auf PHP-Chinesisch. Andere verwandte Artikel online!

Empfohlene Lektüre:

Detaillierte Erläuterung der Konstruktionsschritte des Koa-Projekts

JS-Implementierung der Schnittstelle zum Drucken von Textschriften

Das obige ist der detaillierte Inhalt vonZusammenfassung und Vergleich mehrerer Array-Traversal-Methoden in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!