Rumah  >  Artikel  >  hujung hadapan web  >  Perbandingan Penggunaan Masa Gelung dalam JavaScript

Perbandingan Penggunaan Masa Gelung dalam JavaScript

王林
王林asal
2024-07-19 04:25:20935semak imbas

Comparison of Loop Time Consumption in JavaScript

pengenalan

Gelung ialah binaan asas dalam JavaScript yang membolehkan pelaksanaan berulang blok kod. Walau bagaimanapun, jenis gelung yang berbeza boleh mempamerkan ciri prestasi yang berbeza-beza. Memahami perbezaan ini boleh membantu pembangun menulis kod yang lebih cekap. Artikel ini membandingkan penggunaan masa pelbagai binaan gelung dalam JavaScript dengan contoh praktikal.

Jenis Gelung dalam JavaScript

  1. untuk Gelung
  2. semasa Gelung
  3. Gelung lakukan sambil
  4. untuk...dalam Gelung
  5. untuk...Gelung
  6. Kaedah Array.forEach

Mengukur Prestasi Gelung

Untuk membandingkan prestasi gelung yang berbeza, kami akan menggunakan kaedah console.time dan console.timeEnd, yang membolehkan kami mengukur masa pelaksanaan blok kod dengan tepat.

Contoh Persediaan

Kami akan menggunakan tatasusunan 1,000,000 nombor untuk melaksanakan operasi gelung kami dan mengukur masa yang diambil oleh setiap jenis gelung untuk memproses tatasusunan ini.

const array = Array.from({ length: 1000000 }, (_, i) => i);

Contoh Perbandingan Prestasi

untuk Gelung

console.time('for loop');
for (let i = 0; i < array.length; i++) {
    array[i] *= 2;
}
console.timeEnd('for loop');

manakala Gelung

console.time('while loop');
let i = 0;
while (i < array.length) {
    array[i] *= 2;
    i++;
}
console.timeEnd('while loop');

gelung do-while

console.time('do-while loop');
let j = 0;
do {
    array[j] *= 2;
    j++;
} while (j < array.length);
console.timeEnd('do-while loop');

untuk...dalam Gelung

console.time('for...in loop');
for (let index in array) {
    array[index] *= 2;
}
console.timeEnd('for...in loop');

untuk...daripada Gelung

console.time('for...of loop');
for (let value of array) {
    value *= 2;
}
console.timeEnd('for...of loop');

Array.forEach Kaedah

console.time('forEach loop');
array.forEach((value, index) => {
    array[index] *= 2;
});
console.timeEnd('forEach loop');

Keputusan dan Analisis

Selepas menjalankan coretan kod di atas, anda akan mendapat output konsol yang serupa dengan yang berikut:

for loop: 50ms
while loop: 55ms
do-while loop: 60ms
for...in loop: 300ms
for...of loop: 70ms
forEach loop: 65ms

Pemerhatian

  1. untuk Gelung: Gelung ini biasanya menawarkan prestasi terbaik kerana sifatnya yang mudah dan overhed yang minimum.
  2. while Loop: Lebih perlahan sedikit daripada gelung for, terutamanya disebabkan oleh overhed penambahan pembolehubah gelung secara berasingan.
  3. Gelung lakukan-sementara: Sama seperti gelung while tetapi menjamin sekurang-kurangnya satu lelaran, menghasilkan lebih sedikit overhed.
  4. untuk...dalam Gelung: Jauh lebih perlahan apabila digunakan dengan tatasusunan kerana ia direka untuk mengulangi sifat objek dan bukan untuk pengindeksan berangka.
  5. untuk...Gelung: Menawarkan prestasi yang baik dan lebih mudah dibaca untuk mengulang elemen tatasusunan.
  6. Kaedah Array.forEach: Walaupun lebih mudah dibaca dan ringkas, ia biasanya lebih perlahan daripada gelung tradisional disebabkan oleh overhed pemanggilan fungsi panggil balik.

Kesimpulan

Dalam JavaScript, gelung berbeza mempunyai ciri prestasi yang berbeza. Gelung for dan while biasanya yang paling pantas, manakala gelung for...in adalah yang paling perlahan untuk lelaran tatasusunan. Kaedah gelung for...of dan Array.forEach menawarkan keseimbangan yang baik antara kebolehbacaan dan prestasi. Memahami perbezaan ini boleh membantu pembangun memilih binaan gelung yang paling sesuai untuk kes penggunaan khusus mereka, memastikan prestasi optimum aplikasi mereka.

Amalan Terbaik

  • Gunakan untuk gelung untuk prestasi maksimum dengan tatasusunan.
  • Gunakan untuk...gelung untuk kebolehbacaan yang lebih baik dengan pertukaran prestasi yang minimum.
  • Elakkan untuk...dalam gelung untuk tatasusunan kerana prestasi yang lemah.
  • Gunakan Array.forEach untuk kod ringkas dan boleh dibaca, terutamanya apabila prestasi bukan kebimbangan kritikal.

Dengan menggunakan cerapan ini, pembangun boleh menulis kod JavaScript yang lebih cekap dan boleh diselenggara.

Atas ialah kandungan terperinci Perbandingan Penggunaan Masa Gelung dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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