Dieses Mal werde ich Beispiele für häufig verwendete JS-Array-Traversal-Methoden vergleichen. Welche Vorsichtsmaßnahmen gibt es für häufig verwendete JS-Array-Traversal-Methoden? Hier sind praktische Fälle.
VorwortDieser 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-TraversalJS-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++) {
}Nach dem Login kopieren
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++) {
}Nach dem Login kopieren
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++) {
}Nach dem Login kopieren
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){
});Nach dem Login kopieren
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){
});Nach dem Login kopieren
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
Sechster Typ: Forin-Schleife
Der Code lautet wie folgt:
for(j in arr) {
}Nach dem Login kopieren
Kurzbeschreibung: Viele Leute verwenden diese Schleife gerne, aber nach Analyse und Tests ist ihre Effizienz unter den vielen Schleifendurchquerungsmethoden
am niedrigsten
Siebtens: Kartendurchquerung
Der Code lautet wie folgt:
arr.map(function(n){
});Nach dem Login kopieren
Kurze Beschreibung: Auch diese Methode ist weit verbreitet, obwohl sie eleganter zu verwenden ist, ist die tatsächliche Effizienz nicht so gut wie foreach
Achter Typ: forof traversal (erfordert ES6-Unterstützung)
Der Code lautet wie folgt:
for(let value of arr) {
});Nach dem Login kopieren
Kurze Beschreibung: Diese Methode wird in es6 verwendet, und seine Leistung ist besser als die von 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, 10 Zyklen insgesamt, 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
Wie man JS verwendet, um mehrere Arrays zusammenzuführen und Neuberechnungen zu vermeiden
Detaillierte Erläuterung der zu verwendenden Schritte AntD-Dropdown-Box-Verknüpfung
Das obige ist der detaillierte Inhalt vonVergleich von Beispielen häufig verwendeter Array-Traversal-Methoden in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
