Vòng lặp trong Javascript

JavaScript là ngôn ngữ phía Front end giúp cho bạn tiếp cận lập trình khá tốt. Với nhiều kiến thức làm tăng khả năng tư duy và cũng tương đối dễ học. Một trong những kiến thức cần nắm vững trong JavaScript đó là vòng lặp. Lợi ích của nó mang lại không hề nhỏ. Vậy vòng lặp là gì và cách sử dụng trong Js như thế nào. Hãy theo dõi ngay sau đây.

Vòng lặp trong JavaScript là gì?

Vòng lặp (Loop) là khối lệnh thực thi một công việc lặp đi lặp lại nhiều lần khi điều kiện còn đúng (True). Và sẽ kết thúc khi điều kiện sai (False).

Ví dụ giờ mình cần viết dãy số từ 1 đến 100 trên màn hình mà gõ số 100 lần cũng đủ mệt rồi. Nhưng khi dùng vòng lặp mọi chuyện trở nên đơn giản hơn. Chỉ vài câu lệnh ngắn ngủ nó sẽ in ra 1 – 100.

Các loại vòng lặp trong JavaScript

Trong Js có những kiểu vòng lặp như for, whilte, do…while, for…in, for… of. Sau đây chúng ta sẽ đi chi tiết từng cái một.

1. Vòng lặp For

For cho phép bạn tạo một vòng lặp với 3 biểu thức tùy chọn.

Khởi tạo biến với giá trị ban đầu là không. Sử dụng từ khóa var để khai báo biến bộ đếm, biến đó sẽ có hàm hoặc phạm vi toàn cục. Còn sử dụng từ khóa let để khai báo biến counter, thì biến sẽ có phạm vi bị chặn, phạm vi này chỉ có thể truy cập bên trong vòng lặp.
Điều kiện là a < 10. Khi điều kiện vẫn nhỏ hơn 10 thì vòng lặp là true. Còn khi a = 10 điều kiện lúc này là false nó sẽ dừng chạy.
a++ tăng giá trị sau mỗi lần lặp

<script>

var a;

for (a = 0; a < 10; a++) {

  document.write(a + "<br/>");

}

</script>

2. Vòng lặp While

While sẽ thực thi lệnh hoặc khối code lặp đi lặp lại miễn là biểu thức vẫn còn true. Khi biểu thức trở thành false, vòng lặp được kết thúc.

Vòng lặp while sẽ kiểm tra điều kiện cho trước trước rồi chạy liên tục cho tới khi điều kiện không còn thỏa mãn.

<script> 

var b; 

while ( b < 20 ) { 

document.write(b + "<br/>"); 

} 

</script>

3. Vòng lặp do…while

Câu lệnh do…while tạo ra một vòng lặp thực thi một khối mã ít nhất một lần, trước khi kiểm tra xem điều kiện có đúng không, sau đó nó sẽ lặp lại vòng lặp miễn là điều kiện là đúng.

Sự khác biệt với while đó chính là while sẽ kiểm tra điều kiện trước, nếu không đúng thì dừng ngay không chạy. Còn với do…while nó sẽ chạy 1 lần trước khi kiểm tra điều kiện.

<script>  
var num=1;  
do{   
document.write(num + "<br/>") ;
num++;
}  while (num<=10)  
</script>

4. Vòng lặp for…in

Vòng lặp for…in lặp qua thuộc tính của một đối tượng.

Ví dụ:

<script>
// Một đối tượng Object
var people = {"Name": "Xmen", "Age": "1000"};
 
// Lặp qua tất cả các thuộc tính
for(var x in people) {  
    document.write("<p>" + x + " = " + people[x] + "</p>"); 
}
</script>

5. Vòng lặp for…of

Vòng lặp for…of lặp qua các giá trị của một đối tượng có thể lặp lại.

Lặp qua chuỗi:

<script>
var string = 'JavaScript';
var i;

for (i of string) {
  document.write(i + "<br >");
}
</script>

Lặp qua mảng:

<script>
var cars = ['BMW', 'Volvo', 'Mini'];
var i;

for (i of cars) {
  document.write(i + "<br >");
}
</script>

Kết luận: Trên đây Quách Quỳnh đã giới thiệu 5 vòng lặp trong JavaScript. Chúng rất hữu ích khi học lập trình, và đặc biệt hơn sau này khi học các ngôn ngữ khác như PHP, Java bạn cũng sẽ hiểu nhanh hơn.