Apakah Cara Paling Cekap untuk Menukar HTMLCollection kepada Array dalam JavaScript?

Linda Hamilton
Lepaskan: 2024-11-17 18:13:02
asal
161 orang telah melayarinya

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

Penukaran HTMLCollection kepada Array yang Cekap

Menukar HTMLCollection kepada tatasusunan ialah tugas biasa dalam pembangunan bahagian hadapan. Walaupun melelaran secara manual dan menolak setiap item adalah pendekatan yang mudah, terdapat kaedah yang lebih optimum untuk dipertimbangkan.

Pendekatan Kod Asli

Satu alternatif yang cekap ialah menggunakan kaedah asli Kaedah Array.prototype.slice.call():

var arr = Array.prototype.slice.call(htmlCollection)
Salin selepas log masuk

Kaedah ini menukarkan HTMLKoleksi kepada tatasusunan dengan menghirisnya.

Ungkapan Ringkas

Ungkapan yang lebih ringkas dengan fungsi yang sama secara berkesan ialah:

var arr = [].slice.call(htmlCollection);
Salin selepas log masuk

Kaedah Array.from()

ECMAScript 2015 (ES 6) memperkenalkan kaedah Array.from(), yang menyediakan cara yang jelas untuk menukar daripada iterable kepada array:

var arr = Array.from(htmlCollection);
Salin selepas log masuk

Spread Operator

ES 6 juga menawarkan pengendali hamparan, yang boleh digunakan secara fungsi bersamaan dengan Array.from():

var arr = [...htmlCollection];
Salin selepas log masuk

Pertimbangan Prestasi

Perbandingan prestasi kaedah ini pada NodeList tidak menunjukkan perbezaan yang ketara.

Kesimpulan

Kaedah ini menawarkan cara yang cekap untuk menukar HTMLCollection kepada tatasusunan. Pilihan kaedah mungkin bergantung pada senario tertentu, dengan ciri ES 6 yang lebih baharu seperti Array.from() dan operator spread yang menyediakan簡潔 dan alternatif moden.

Atas ialah kandungan terperinci Apakah Cara Paling Cekap untuk Menukar HTMLCollection kepada Array dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan