Semua mengenai gelung JavaScript

Setiap bahasa pengaturcaraan menggunakan gelung untuk berulang kali melaksanakan blok kod. Gelung adalah penting untuk memproses susunan, senarai, atau tindakan mengulangi sehingga keadaan tertentu dipenuhi.

JavaScript menawarkan pelbagai jenis gelung. Gambaran keseluruhan ini meneroka setiap jenis, menonjolkan aplikasi dan kelebihan perbandingan mereka.

dan while gelung do...while

gelung

, gelung yang paling asas, melaksanakan blok kod selagi keadaan tertentu tetap benar. Ia mudah, boleh dibaca, dan sering cekap. Walau bagaimanapun, ia juga terdedah kepada gelung tak terhingga jika keadaan tidak diurus dengan teliti. Gelung while adalah sama, tetapi keadaannya diperiksa do...while selepas setiap lelaran, menjamin sekurang -kurangnya satu pelaksanaan.

// Process an array until it's empty
let queue1 = ["a", "b", "c"];

while (queue1.length) {
  let item = queue1.shift();
  console.log(item);
}

// Similar, but handles empty array gracefully
let queue2 = [];

do {
  let item = queue2.shift() ?? "empty";
  console.log(item);
} while (queue2.length);

gelung

for

Gelung

sesuai untuk melelehkan beberapa kali tertentu. Ia kuat dan cekap untuk tugas berulang. Walaupun pada mulanya menakutkan kepada pemula, memahami strukturnya memudahkan penggunaannya. for

// Log numbers 1 to 5
for (let i = 1; i <= 5; i++) {
  console.log(i);
}

dan for...of gelung for await...of

Gelung

menyediakan cara ringkas untuk melangkah ke atas objek yang boleh dimakan seperti tatasusunan, peta, set, dan rentetan. Ia memudahkan traversal array berbanding dengan gelung tradisional for...of. for

let myList = ["a", "b", "c"];

for (let item of myList) {
  console.log(item);
}

tidak terhad kepada iterables terbina dalam; Iterables tersuai boleh dibuat dengan melaksanakan protokol itable (menambah kaedah for...of). [Symbol.iterator] adalah rakan sejawat yang tidak segerak, sesuai untuk bekerja dengan iterables dan penjana asynchronous. for await...of

async function delay(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function* aNumberAMinute() {
  let i = 0;
  while (true) {
    yield i++;
    await delay(60000);
  }
}

for await (let i of aNumberAMinute()) {
  console.log(i);
  if (i >= 59) break;
}

nota: berfungsi dengan iterables bukan async, tetapi sebaliknya tidak benar.

for await...of

dan

kaedah forEach map

dan

tidak ketat gelung, tetapi mereka memudahkan lelaran array. forEach Melaksanakan fungsi yang disediakan sekali untuk setiap elemen array. Walaupun sejarah lebih perlahan daripada map gelung, enjin JavaScript moden telah meminimumkan perbezaan prestasi ini. forEach Mewujudkan array baru dengan menggunakan fungsi untuk setiap elemen array asal. Kedua -dua kaedah ini menawarkan kelebihan pembacaan dalam konteks tertentu, terutamanya apabila bekerja dengan paradigma pengaturcaraan berfungsi. for map

["a", "b", "c"].forEach((item, index) => console.log(`${index}: ${item}`));

let doubled = [1, 2, 3].map(x => x * 2); // doubled = [2, 4, 6]

gelung

for...in Loop

melangkah ke atas sifat -sifat yang boleh dibaca sesuatu objek. Ia juga termasuk sifat yang diwarisi, yang boleh menjadi sumber tingkah laku yang tidak dijangka. Ia paling sesuai untuk melelehkan literasi objek di mana sifat -sifat yang diwarisi tidak menjadi kebimbangan. Pesanan utama kini konsisten merentasi pelayar.

// Process an array until it's empty
let queue1 = ["a", "b", "c"];

while (queue1.length) {
  let item = queue1.shift();
  console.log(item);
}

// Similar, but handles empty array gracefully
let queue2 = [];

do {
  let item = queue2.shift() ?? "empty";
  console.log(item);
} while (queue2.length);

Kesimpulan

JavaScript menyediakan satu set mekanisme gelung yang kaya. Memilih gelung yang sesuai bergantung kepada tugas tertentu, keperluan prestasi, dan keutamaan gaya pengekodan. Memahami nuansa setiap jenis memberi kuasa kepada pemaju untuk menulis kod yang cekap dan boleh dipelihara.

Atas ialah kandungan terperinci Semua mengenai gelung JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!