JavaScript untuk gelung



Gelung melaksanakan blok kod beberapa kali tertentu.


Gelung JavaScript

Menggunakan gelung adalah mudah jika anda ingin menjalankan kod yang sama berulang kali, dengan nilai yang berbeza setiap kali.

Kita boleh mengeluarkan nilai tatasusunan seperti ini:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>		
<body>

<script>
cars=["BMW","Volvo","Saab","Ford"];
for (var i=0;i<cars.length;i++){
	document.write(cars[i] + "<br>");
}
</script>

</body>
</html>

Jalankan instance»

Klik butang "Jalankan contoh" untuk melihat tika dalam talian


Jenis gelung yang berbeza

JavaScript menyokong pelbagai jenis gelung:

  • untuk - Gelung melalui blok kod beberapa kali

  • untuk/dalam - Gelung melalui sifat-sifat objek

  • semasa - Menggelung blok kod yang ditentukan apabila keadaan yang dinyatakan adalah benar

  • buat/sementara - Begitu juga, apabila keadaan yang dinyatakan ialah Gelung blok kod yang ditentukan apabila benar


Untuk Gelung

Gelung for ialah alat yang anda selalunya akan digunakan apabila anda ingin membuat gelung.

Berikut ialah sintaks gelung for:

for ( pernyataan 1; pernyataan 2; pernyataan 3)
{
Blok kod yang dilaksanakan
}

Pernyataan 1 (blok kod) dilaksanakan sebelum bermula bermula.

Pernyataan 2 mentakrifkan keadaan di mana gelung (blok kod) dijalankan

Pernyataan 3 dilaksanakan selepas gelung ( blok kod) telah dilaksanakan

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>点击按钮循环代码5次。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
	var x="";
	for (var i=0;i<5;i++){
		x=x + "该数字为 " + i + "<br>";
	}
	document.getElementById("demo").innerHTML=x;
}
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk lihat contoh dalam talian

Daripada contoh di atas, anda boleh lihat:

Pernyataan 1 menetapkan pembolehubah (var i=0) sebelum gelung bermula.

Pernyataan 2 mentakrifkan syarat untuk gelung berjalan (i mestilah kurang daripada 5).

Pernyataan 3 menambah nilai (i++) setiap kali blok kod telah dilaksanakan.


Pernyataan 1

Biasanya kita akan menggunakan pernyataan 1 untuk memulakan pembolehubah yang digunakan dalam gelung (var i=0).

Pernyataan 1 adalah pilihan, yang bermaksud anda boleh melakukannya tanpa pernyataan 1.

Anda boleh memulakan mana-mana (atau berbilang) nilai dalam pernyataan 1:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<script>
cars=["BMW","Volvo","Saab","Ford"];
for (var i=0,l=cars.length; i<l; i++){
	document.write(cars[i] + "<br>");
}
</script>

</body>
</html>

Run Instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

Pada masa yang sama, anda juga boleh meninggalkan pernyataan 1 (contohnya, apabila nilai telah ditetapkan sebelum gelung bermula):

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<script>
cars=["BMW","Volvo","Saab","Ford"];
var i=2,len=cars.length;
for (; i<len; i++){
	document.write(cars[i] + "<br>");
}
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat dalam talian contoh


Pernyataan 2

Biasanya pernyataan 2 digunakan untuk menilai keadaan pembolehubah awal.

Penyata 2 juga adalah pilihan.

Jika pernyataan 2 mengembalikan benar, gelung bermula semula, jika ia mengembalikan palsu, gelung berakhir.

lamp如果您省略了语句 2,那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。请在本教程稍后的章节阅读有关 break 的内容。



Pernyataan 3

Biasanya pernyataan 3 akan meningkatkan nilai pembolehubah awal.

Penyata 3 juga adalah pilihan.

Pernyataan 3 mempunyai banyak kegunaan. Kenaikan boleh menjadi negatif (i--), atau lebih besar (i=i+15).

Pernyataan 3 juga boleh ditinggalkan (contohnya, apabila terdapat kod yang sepadan di dalam gelung):

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<script>
cars=["BMW","Volvo","Saab","Ford"];
var i=0,len=cars.length;
for (; i<len; ){
	document.write(cars[i] + "<br>");
	i++;
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian


For/In Loop

JavaScript for/in statement gelung melalui sifat objek:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
	
<p>点击下面的按钮,循环遍历对象 "person" 的属性。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
	var x;
	var txt="";
	var person={fname:"Bill",lname:"Gates",age:56}; 
	for (x in person){
		txt=txt + person[x];
	}
	document.getElementById("demo").innerHTML=txt;
}
</script>
	
</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Anda akan mengetahui lebih lanjut tentang untuk / dalam gelung dalam bab tentang objek JavaScript.


While Loop

Kami akan menerangkan gelung while dan do/while kepada anda dalam bab seterusnya.