Rumah > hujung hadapan web > tutorial js > Perbandingan Penggunaan Masa Gelung dalam JavaScript

Perbandingan Penggunaan Masa Gelung dalam JavaScript

王林
Lepaskan: 2024-07-19 04:25:20
asal
1089 orang telah melayarinya

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);
Salin selepas log masuk

Contoh Perbandingan Prestasi

untuk Gelung

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

manakala Gelung

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

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');
Salin selepas log masuk

untuk...dalam Gelung

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

untuk...daripada Gelung

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

Array.forEach Kaedah

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

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
Salin selepas log masuk

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!

sumber:dev.to
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan