Soalan Kelajuan JQuery.Each vs untuk Loop

Vanilla Javascript Loops vs. JQuery.Each: Perbandingan Prestasi

Artikel ini meneroka perbezaan prestasi antara menggunakan vanila JavaScript for Loops dan JQuery's $.each kaedah untuk lelaran array. Kami akan menunjukkan bahawa, untuk kelajuan, gelung vanila, terutama mereka yang mempunyai caching yang berubah -ubah, dengan ketara mengalahkan for. Ini boleh mengakibatkan peningkatan kelajuan sehingga 84%, seperti yang ditunjukkan dalam penanda aras JSPERF (pautan yang ditinggalkan untuk keringkasan, tetapi mudah dicari). $.each

jQuery.each Contoh:

$.each(myArray, function() {
  let currentElement = this; 
  // ... your code using currentElement ...
});

untuk gelung dengan caching berubah -ubah (terpantas):

const len = myArray.length;
for (let i = 0; i < len; i++) {
  let currentElement = myArray[i];
  // ... your code using currentElement ...
}

untuk gelung tanpa caching berubah:

for (let i = 0; i < myArray.length; i++) {
  let currentElement = myArray[i];
  // ... your code using currentElement ...
}

percubaan panjang pra-dikira:

(prestasi serupa dengan versi cache)

Soalan Lazim (Soalan Lazim):

let len = myArray.length;
let i = 0;
for (; i < len; i++) {
  let currentElement = myArray[i];
  // ... your code using currentElement ...
}

Walaupun artikel ini memberi tumpuan kepada prestasi, inilah ringkasan perbezaan utama dan pertimbangan untuk memilih antara dan

gelung:

$.each for

Fungsi:
• JQuery's

  melangkah ke atas tatasusunan dan objek, menawarkan sintaks ringkas. gelung memberikan lebih banyak kawalan langsung ke atas lelaran. $.each for

Prestasi:

• gelung (terutamanya dengan caching berubah -ubah) umumnya lebih cepat disebabkan oleh pengurangan fungsi panggilan overhead. Perbezaannya menjadi lebih ketara dengan dataset yang lebih besar. for

kebolehbacaan:

• boleh meningkatkan kebolehbacaan kod untuk lelaran mudah. gelung lebih jelas. $.each for

Memecahkan gelung:
• kembali

  dari panggil balik memecahkan gelung. Gelung menggunakan false. $.each for break

Akses indeks:
• kedua -duanya memberikan akses kepada indeks semasa (walaupun berbeza).

nodelist/htmlcollection:

• Bekerja dengan nodelists dan htmlcollections, tetapi merujuk kepada elemen dom, bukan objek jQuery. Balut dengan untuk menggunakan kaedah jQuery. $.each this $(this)

asli
• :

  JavaScript's Native menawarkan sintaks yang sama kepada forEach tetapi dengan prestasi yang berpotensi lebih baik daripada pelaksanaan JQuery. forEach $.each

lelaran objek:
• kedua -duanya boleh melangkah ke atas objek.

arrays jarang:

• melangkau indeks undefined dalam arrays jarang, manakala gelung termasuk mereka.

• chaining: $.each tidak menyokong chaining seperti kaedah jQuery lain.

Ringkasnya, untuk prestasi yang optimum, terutamanya apabila berurusan dengan dataset yang besar, mengutamakan gelung vanila JavaScript

dengan caching berubah -ubah. JQuery's for lebih mudah untuk dataset yang lebih kecil atau apabila kebolehbacaan adalah yang paling utama. Pertimbangkan JavaScript's Native $.each sebagai alternatif yang lebih cepat untuk JQuery's forEach. $.each

Atas ialah kandungan terperinci Soalan Kelajuan JQuery.Each vs untuk Loop. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!