Methodenkette: filter().map() ist ineffizient?

Methodenverkettung

Möglicherweise haben Sie den Code gesehen, der Array.prototype.filter() und Array.prototype.map() verwendet, um den Wert in Array-Daten in Javascript zu bearbeiten und zu entfernen

Zum Beispiel:

[1,2,3]
.map((mapped) => mapped + 1)
.filter((filtered) => filtered > 1)

Frage

Ich habe mich immer gefragt, ob eine solche Methodenverkettung den Wert im Array bei jeder Iteration iteriert oder ob die V8-Engine möglicherweise den Vorgang optimiert, indem sie unter der Haube eine Datenaggregation durchführt.

Also habe ich eine kleine Recherche durchgeführt.

Wie?

Verwenden Sie console.time und console.timeEnd und messen Sie die durchschnittliche Ausführungszeit 10 Mal mit und ohne Methodenkette.
Für die Untersuchung habe ich den Chrome-Browser verwendet.

console.time('Filter Execution Time')
// YOUR CODE
console.timeEnd('Filter Execution Time')

Ergebnis: Die Methodenverkettung aggregiert den Vorgang nicht.

-	Method Chain(A)	No Method Chain(B)	Aggregate Logic(C)
Iterate 10000000 values	4656 ms	4733 ms	169 ms
Iterate 100000 values	27 ms	24 ms	4 ms

Wie Sie sehen können, zeigte das Ergebnis mit/ohne Methodenkette keinen großen Unterschied, während die Aggregationslogik zu schnelleren Ergebnissen führte.

Code-A. Verwenden Sie Methodenverkettung mit map() und filter()

console.time('Filter Execution Time')
const result = new Array()
.fill(1).map((e) => e + 1)
.filter((e) => e !== 1)
console.timeEnd('Filter Execution Time')

Code-B. Trennen Sie map() und filter() (keine Methodenverkettung)

console.time('Filter Execution Time')
const mapResult = new Array().fill(1).map((e) => e + 1)
const result = mapResult.filter((e) => e !== 1)
console.timeEnd('Filter Execution Time')

Code-C. Aggregierte Logik

console.time('Filter Execution Time')
const result = []
new Array().fill(1).forEach((e) =>  {
    if (e !== 1) result.push(e)
})
console.timeEnd('Filter Execution Time')

Aber Method Chain ist praktisch, nicht wahr?

Für diejenigen, die das glauben: Ich habe das Diagramm für jede Iterationszahl von 100 bis 100.000 unter den Codemustern A, B und C erstellt, indem ich die durchschnittliche Zeit in Millisekunden in 10 Schritten gezählt habe, ähnlich wie oben.

Erkenntnisse

1. Es gibt sowieso keinen großen Unterschied, wenn die Anzahl der Iterationen nicht groß ist, beispielsweise 100 - 1.000.

2. Es wird von Bedeutung sein, wenn die Anzahl der Iterationen exponentiell ansteigt, beispielsweise 1.000.000.

Abschluss

Methodenverkettung aggregiert den Vorgang nicht, während die Differenz der Ergebnisse größer wird, wenn die Anzahl der Iterationen exponentiell zunimmt.

Daher kann man meiner Meinung nach mit Recht sagen, dass es in Ordnung ist, die Methodenkette zu verwenden, wenn die Anzahl der Iterationen gering ist, um von ihrer Handlichkeit zu profitieren. Wenn Sie jedoch mit einer großen Anzahl von Daten arbeiten, sollten Sie dies tun Betrachten Sie den Algorithmus sorgfältig ohne die Methodenkette.

Danke fürs Lesen!

Das obige ist der detaillierte Inhalt vonMethodenkette: filter().map() ist ineffizient?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!