Heim >Web-Frontend >js-Tutorial >Was ist der effizienteste Weg, eine HTMLCollection in JavaScript in ein Array zu konvertieren?

Was ist der effizienteste Weg, eine HTMLCollection in JavaScript in ein Array zu konvertieren?

Linda Hamilton
Linda HamiltonOriginal
2024-11-17 18:13:02218Durchsuche

What's the Most Efficient Way to Convert an HTMLCollection to an Array in JavaScript?

Effiziente HTMLCollection-zu-Array-Konvertierung

Das Konvertieren einer HTMLCollection in ein Array ist eine häufige Aufgabe in der Frontend-Entwicklung. Während das manuelle Durchlaufen und Pushen jedes Elements ein unkomplizierter Ansatz ist, gibt es optimiertere Methoden, die in Betracht gezogen werden sollten.

Native-Code-Ansatz

Eine effiziente Alternative ist die Verwendung des nativen Codes Array.prototype.slice.call()-Methode:

var arr = Array.prototype.slice.call(htmlCollection)

Diese Methode wandelt die HTMLCollection durch Slicing effektiv in ein Array um it.

Prägnanter Ausdruck

Ein prägnanterer Ausdruck mit praktisch der gleichen Funktionalität ist:

var arr = [].slice.call(htmlCollection);

Array.from() Methode

ECMAScript 2015 (ES 6) führte die Methode Array.from() ein, die eine explizite Methode bereitstellt Möglichkeit zur Konvertierung von einem iterierbaren in ein Array:

var arr = Array.from(htmlCollection);

Spread-Operator

ES 6 bietet auch den Spread-Operator, der funktional äquivalent zu Array verwendet werden kann. from():

var arr = [...htmlCollection];

Leistungsüberlegungen

Ein Leistungsvergleich von Diese Methoden auf NodeList zeigen keine signifikanten Unterschiede.

Fazit

Diese Methoden bieten effiziente Möglichkeiten, eine HTMLCollection in ein Array zu konvertieren. Die Wahl der Methode kann vom jeweiligen Szenario abhängen, wobei neuere ES 6-Funktionen wie Array.from() und der Spread-Operator moderne und moderne Alternativen bieten.

Das obige ist der detaillierte Inhalt vonWas ist der effizienteste Weg, eine HTMLCollection in JavaScript in ein Array zu konvertieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn