Javascript - Các kiểu lặp

Các lệnh lặp JS

Cũng giống như cấu trúc rẽ nhánh, cấu trúc vòng lặp cũng là một trong những thành phần quan trọng của một ngôn ngữ lập trình, vòng lặp là hành động lặp lại một khối lệnh với số lần hữu hạn.
 JS nó hỗ trợ chúng ta 4 kiểu vòng lặp(loop):

  1. Cấu trúc lặp while 
  2. Cấu trúc lặp do-while
  3. Cấu trúc lặp for 
  4. Cấu trúc lặp for-in 

1. Cấu trúc lặp while
Vòng lặp while là vòng lặp cơ bản trong JS, về nguyên tắc hoạt động thì giống như trong C/C++. Cấu trúc cơ bản của vòng lặp while.
Cú pháp:

while (expression) { 
    statement
}

Sự hoạt động của vòng lặp while:
Bước 1: tính giá trị của (biểu thức) sau while.
Bước 2: nếu giá trị tính được của (biểu thức) là ‘sai’ (==0) thì kết thúc  vòng lặp while.
Bước 3: nếu giá trị của (biểu thức) là ‘đúng’ (!=0) thì thực hiện khối lệnh sau while.
Bước 4: quay lại bước 1

Chú ý: Trong thân vòng lặp while có thể được thực hiện một lần hoặc nhiều lần và cũng có thể không được thực hiện lần nào nếu ngay từ đầu biểu thức sau while đã sai.

Biểu diễn bằng lưu đồ: 

Ví dụ cấu trúc lặp while

<script>
  i=1;
	while(i<=5){
		document.writeln("<h1> "+ i +" năm chờ đợi </h1> \n"); // \n xuống dòng
		i++;
	}
</script>

Xem ví dụ

2. Cấu trúc lặp do...while
Vòng lặp do-while cũng giống như while nhưng chỉ có điều là do-while xét điều kiện lặp sau khi mỗi vòng lặp. Cấu trúc do-while chỉ có một cú pháp.
Cú pháp:         

do{
     statement
}while (expresion);

Giải thích cú pháp:
Bước 1: thực hiện khối lệnh sau do.
Bước 2: kiểm tra giá trị biểu thức <biểu thức> sau while, nếu có giá trị ‘đúng’ ( khác 0) thì lặp lại bước 1, nếu ‘sai’ (=0) thì kết thúc vòng lặp.
Biểu diễn bằng lưu đồ: 

Ví dụ cấu trúc lặp do ... while

<script>
    i=1;
	do{
		document.writeln("<h1> "+i+" năm yêu em! </h1> \n"); // \n xuống dòng
		i++;
	}while(i<=10);
</script>

Xem ví dụ

3. Cấu trúc lặp for
Vòng lặp for là vòng lặp khá là phức tạp hơn vòng lặp while. Vòng lặp for có hai cú pháp như sau:

Cú pháp:

for (expr1; expr2; expr3) {
    statement
}

Trong đó:
    Biểu thức 1: biểu thức khởi đầu.
    Biểu thức 2: biểu thức điều kiện - điều kiện lặp.
    Biểu thức 3: bước nhảy - thường dùng với ý nghĩa là thay đổi bước nhảy.

Cả 3 biểu thức này đều là tuỳ chọn, chúng có thể vắng mặt trong câu lệnh cụ thể nhưng các dấu chấm phẩy vẫn phải có.
Sự hoạt động của vòng lặp for:

  • Bước 1: Thực hiện biểu thức khởi đầu – Biểu thức 1.
  • Bước 2: Tính giá trị biểu thức 2 để xác định điều kiện lặp.
    - Nếu biểu thức 2 có giá trị ‘sai’ (==0) thì ra khỏi vòng lặp.
    - Ngược lại, nếu biểu thức có giá trị ‘đúng’ ( khác 0) thì chuyển tới bước 3.
  • Bước 3: Thực hiện khối lệnh sau for ( thân của for ), chuyển tới bước 4.
  • Bước 4: Thực hiện biểu thức 3, rồi quay về bước 2.

Biểu diễn bằng lưu đồ: 

Ví dụ:

<script>
for(i=0;i<10;i++){
   document.write("<h1> "+i+"năm yêu em! </h1> \n");
}
</script>

Xem ví dụ

4. Cấu trúc lặp for ... in
Câu lệnh này được sử dụng biêt tất cả các thuộc tính (properties) của một đối tượng. 

Cú pháp:

for (<variable> in <object>) {
//Các câu lệnh
}

Ví dụ:  In tất cả các thuộc tính của đối tượng Window. 

<Body><SCRIPT LANGUAGE= "JavaScript"><BODY>
document.write("The properties of the Window  object are: <BR>");
for (var x in window)
	document.write("     "+ x + ", ");
</SCRIPT></Body

Xem ví dụ