Bagaimana dengan Cekap Menukar HTMLCollection kepada Array dalam JavaScript?

Penukaran Cekap HTMLCollection kepada Array

Menukar HTMLCollection, koleksi elemen dalam dokumen HTML, kepada tatasusunan ialah tugas biasa dalam pembangunan web. Semasa mengulang dan menyalin secara manual setiap item ke dalam tatasusunan berfungsi, ia boleh menjadi tidak cekap.

Penyelesaian Kod "Asli"

Pendekatan yang lebih cekap ialah menggunakan JavaScript asli method Array.prototype.slice.call():

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

Kaedah ini mengembalikan tatasusunan yang mengandungi unsur-unsur daripada htmlObjek koleksi.

Ungkapan Ringkas

Memandangkan sintaks boleh menjadi verbose, ungkapan setara yang lebih ringkas ialah:

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

ES6 Penyelesaian

ES6 (ECMAScript 2015) memperkenalkan pilihan tambahan:

• Array.from(): Menukar objek boleh lelar, seperti HTMLCollection, kepada tatasusunan.

var arr = Array.from(htmlCollection);

• Spread Operator: Membongkar objek boleh lelar ke dalam tatasusunan.

var arr = [...htmlCollection];

Perbandingan Prestasi

Tanda aras (cth., https://jsben.ch/h2IFA) menunjukkan bahawa kaedah berikut mempunyai persamaan prestasi:

• Array.prototype.slice.call()
• [].slice.call()
• Array.from()

Pengendali spread agak perlahan, tetapi ia mungkin lebih disukai kerana ringkasnya sintaks.

Oleh itu, cara paling berkesan untuk menukar HTMLCollection kepada tatasusunan bergantung pada keperluan dan keutamaan khusus pembangun.

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