Pembelajaran loop JS: penggunaan pernyataan for loop (contoh detail)

1: perulangan for Perulangan

for akan menentukan terlebih dahulu variabel-variabel yang mengontrol jumlah perulangan dalam pernyataan for, sehingga pernyataan perulangan for dapat melakukan operasi perulangan sesuai dengan jumlah perulangan yang diketahui, yang cocok untuk situasi di mana jumlah perulangan kali skrip perlu dijalankan diketahui dengan jelas.

Format sintaksis perulangan for adalah sebagai berikut:

for (pernyataan inisialisasi; kondisi perulangan; pembaruan variabel--kenaikan atau pengurangan) {
    blok pernyataan;   
}

Pernyataan perulangan for dapat dipecah menjadi 4 bagian: tiga ekspresi di () dan "blok pernyataan" di {} Mari kita analisa di bawah.

Analisis pernyataan:

• Pernyataan inisialisasi (ekspresi 1): Ini terutama digunakan untuk menginisialisasi nilai variabel, yang digunakan untuk menyetel penghitung, yaitu nilai di awal perulangan; pernyataan ini hanya dijalankan selama perulangan pertama dan tidak akan dijalankan dieksekusi lagi di masa depan.

• Kondisi perulangan (ekspresi 2): Kondisi pembatasan eksekusi perulangan, digunakan untuk mengontrol apakah akan mengeksekusi kode di badan perulangan; jika kondisinya TRUE, perulangan dilanjutkan, jika kondisinya FALSE, perulangan berakhir dan perulangan keluar langsung.
  

• Pembaruan variabel (Ekspresi 3): Ekspresi dengan operasi kenaikan atau penurunan. Setiap kali loop dijalankan, nilai penghitung segera diubah sehingga kondisi loop secara bertahap menjadi "tidak benar".
  

• Blok pernyataan: Sejumlah kode yang perlu dieksekusi ketika kondisi dinilai benar.
  

Apakah uraian di atas agak membingungkan? Mari kita lihat diagram alur eksekusi pernyataan perulangan for untuk memahami proses eksekusi perulangan for secara lebih intuitif:

Sekarang setelah kita memahami proses eksekusi perulangan for, mari kita lakukan operasi sebenarnya dan mengerjakan pertanyaan kecil untuk melihat apakah kita sudah menguasainya!

Contoh: Hitung jumlah dari 1 sampai 100

<script type="text/javascript">
	var jumlah=0;
	untuk(var i=1; i<=100; i++){
		jumlah+=saya;
	}
	console.log('1 + 2 + 3 +...+ 99 + 100 = '+jumlah);
</skrip>

Tiga ekspresi dalam

loop for JS dapat dihilangkan, tetapi titik koma yang digunakan untuk memisahkan ketiga ekspresi tidak dapat dihilangkan, seperti yang ditunjukkan dalam contoh berikut:

// Hilangkan ekspresi pertama Rumus var i = 0;
untuk (; saya < 5; saya++) {
    //Kode yang akan dieksekusi}
// Hilangkan ekspresi kedua untuk (var y = 0; ; y++) {
    jika(y>5){
        merusak;
    }
    //Kode yang akan dieksekusi}
// Hilangkan ekspresi pertama dan ketiga var j = 0;
untuk (; j < 5;) {
    // Kode yang akan dieksekusi j++;
}
// Hilangkan semua ekspresi var z = 0;
untuk (;;) {
    jika(z>5){
        merusak;
    }
    // Kode yang akan dieksekusi z++;
}

Dua: for loop nesting

Apa pun jenis loopnya, loop tersebut dapat disarangkan (yaitu, satu atau lebih loop didefinisikan dalam satu loop).

Format sintaksis:

for (pernyataan inisialisasi 1; kondisi loop; pembaruan variabel - kenaikan atau penurunan mandiri) {
    //Blok pernyataan 1;   
    for (pernyataan inisialisasi 2; kondisi perulangan; pembaruan variabel - penambahan atau pengurangan mandiri) {
        //Blok pernyataan 2;
        for (pernyataan inisialisasi 3; kondisi perulangan; pembaruan variabel--kenaikan atau pengurangan) {
            //Blok pernyataan 3; 
            .....  
        }
    }
}

Di sini, kita mendefinisikan tiga kumpulan perulangan for. Tentu saja, kita dapat membuat kumpulan perulangan for sebanyak yang kita inginkan.

Kasus: for loop mengimplementasikan tabel perkalian.

Pertama, mari kita lihat tabel perkalian.

Kita dapat menggambar pola bagan:

• totalnya ada 9 baris dan 9 kolom, dan ada beberapa ekspresi di setiap baris.

• Pada baris ke-i, ekspresi dimulai dari i*1 dan berakhir di i*i. Ada total ekspresi i (kita dapat mencapai efek ini melalui loop).

Oleh karena itu, loop ganda diperlukan untuk mengontrol output. Loop luar mengontrol jumlah baris i (i minimum 1 dan maksimum 9), dan loop dalam mengontrol kolom j (j minimum 1 dan maksimum sama dengan). kepada saya).

Kode implementasi:

for(var i = 1; i <= 9; i++){ //Loop luar mengontrol baris for(var j = 1; j <= i; j++) //Loop dalam mengontrol kolom {
		document.write(j+"*"+i+"="+j*i+"&nbsp;&nbsp;&nbsp;");
	}
	dokumen.write("</br>");
}

Hasil keluaran:

Kita juga dapat memasukkan tabel perkalian 99 ke dalam tabel dan menampilkannya seperti yang ditunjukkan pada gambar awal:

document.write("<table>");

for (var i = 1; i <= 9; i++) { //Garis kontrol loop luar document.write("<tr>");
	for (var j = 1; j <= i; j++) //Kolom kontrol loop dalam {
		document.write("<td>" + j + "*" + i + "=" + j * i + "</td>");
	}
	//Pemutusan baris, mengontrol berapa banyak ekspresi yang dihasilkan di setiap baris document.write("</tr>");
}
document.write("</table>");

Kemudian tambahkan gaya css untuk memodifikasinya:

meja {
	lebar: 600 piksel;
	keruntuhan perbatasan: terpisah;
}

tabel td {
	batas: #000 1 piksel padat;
	perataan teks: tengah;
}

Lihatlah hasilnya:

[Pembelajaran yang disarankan: tutorial lanjutan JavaScript]

Di atas adalah konten detail pembelajaran loop JS: penggunaan pernyataan loop for (contoh detail). Untuk lebih lanjut, harap perhatikan artikel terkait lainnya di situs web PHP Cina!