Mastering JavaScript Loops

Trong lập trình, có nhiều tình huống mà bạn cần lặp lại một hành động nhiều lần. Ví dụ, hãy tưởng tượng bạn muốn hiển thị thông báo “Hello, world!” trên console mười lần. Mặc dù bạn có thể viết console.log("Hello, world!"); mười lần, nhưng điều đó sẽ rất kém hiệu quả. May mắn thay, JavaScript (hay bất cứ ngôn ngữ lập trình nào cũng vậy :v) cung cấp một giải pháp tốt hơn: Loops (vòng lặp).

Vòng lặp cho phép bạn thực thi một khối mã nhiều lần, giúp mã của bạn ngắn gọn hơn và tiết kiệm thời gian.

Loại vòng lặp phổ biến nhất trong JavaScript là vòng lặp for. Dưới đây là cách cấu trúc của nó:

for (initialization; condition; final-expression) {
  // Code to be executed repeatedly
}

Trong đó:

• initialization: khai báo một biến đếm vòng lặp và đặt giá trị ban đầu của nó (ví dụ: let i = 0). Phần này chỉ chạy một lần khi bắt đầu vòng lặp.
• condition: biểu thức boolean này được kiểm tra trước mỗi lần lặp. Nếu đúng, vòng lặp tiếp tục; nếu sai, vòng lặp dừng lại.
• final-expression: biểu thức này được thực thi sau mỗi lần lặp, thường dùng để cập nhật biến đếm vòng lặp (ví dụ: i++).

Code để in ra “Hello, world!” mười lần trong JavaScript sẽ trông thế này:

for (let i = 0; i < 10; i++) {
  console.log("Hello, world!");
}

Trong đó:

• Vòng lặp bắt đầu với i được đặt bằng 0.
• Điều kiện i < 10 đảm bảo rằng vòng lặp sẽ chạy miễn là i nhỏ hơn 10.
• Ở cuối mỗi lần lặp, i được tăng thêm 1 (i++), và thông báo được ghi vào console.

Vòng lặp while: Lặp lại cho đến khi điều kiện sai

Một loại vòng lặp khác cũng rát phổ biết và hay được sử dụng là vòng lặp while, vòng lặp này sẽ tiếp tục thực thi một khối mã miễn là một điều kiện cụ thể là đúng.

Ví dụ chúng ta đếm ngược từ 10 đến 1:

let count = 10;

while (count > 0) {
  console.log(count);
  count--; // Decrease the count by 1 in each iteration
}

Vòng lặp do…while: Đảm bảo thực thi ít nhất một lần

Vòng lặp do...while tương tự như vòng lặp while, nhưng nó đảm bảo rằng khối mã sẽ chạy ít nhất một lần, ngay cả khi điều kiện ban đầu là sai.

Cú pháp:

do {
  // Code to be executed repeatedly
} while

Vòng lặp này rất hữu ích trong các tình huống mà bạn cần thực hiện một hành động ít nhất một lần trước khi kiểm tra điều kiện.

Tránh vòng lặp vô hạn

Vòng lặp vô hạn xảy ra khi điều kiện của vòng lặp không bao giờ trở thành sai, dẫn đến mã chạy mãi mãi và có thể làm trình duyệt bị treo. Luôn đảm bảo vòng lặp của bạn có cách để dừng lại.

// Vòng lặp này chạy mãi mãi vì điều kiện luôn đúng
for (let i = 0; i >= 0; i++) {
  console.log("This will print forever!");
}

Vòng lặp for…in và for…of: Làm việc với đối tượng và mảng

JavaScript cũng cung cấp các vòng lặp chuyên dụng để làm việc với đối tượng và mảng:

• for…in: duyệt qua các thuộc tính liệt kê của một đối tượng.
• for…of: duyệt qua các giá trị có thể lặp lại của một mảng hoặc các đối tượng có thể lặp khác (ví dụ: chuỗi, tập hợp, map).

Điều khiển vòng lặp với break và continue

Đôi khi, chúng ta cần kiểm soát luồng của vòng lặp. JavaScript cung cấp các lệnh break và continue để làm điều này:

• break: thoát khỏi vòng lặp ngay lập tức.
• continue: bỏ qua lần lặp hiện tại và chuyển sang lần tiếp theo.

Ví dụ:

// Sử dụng break để dừng vòng lặp sớm
for (let i = 0; i < 10; i++) {
  console.log(i);
  if (i === 5) {
    console.log("Stopping the loop at 5");
    break; // Thoát khỏi vòng lặp khi i đạt đến 5
  }
}

// Sử dụng continue để bỏ qua các số lẻ
for (let i = 0; i < 10; i++) {
  if (i % 2 !== 0) { // Kiểm tra nếu i là số lẻ
    continue; // Bỏ qua lần lặp này nếu i là số lẻ
  }
  console.log(i); // Chỉ in các số chẵn
}

Lời kết

Vòng lặp là một phần quan trọng trong lập trình và thành thạo chúng sẽ giúp bạn viết mã hiệu quả và mạnh mẽ hơn. Từ vòng lặp for đến while và hơn thế nữa, mỗi loại vòng lặp có mục đích riêng, giúp bạn dễ dàng xử lý các công việc lặp đi lặp lại.

Bài viết mang tính chất “ghi chú, lưu trữ, chia sẻ và phi lợi nhuận”.
Nếu bạn thấy hữu ích, đừng quên chia sẻ với bạn bè và đồng nghiệp của mình nhé!

Happy coding! 😎 👍🏻 🚀 🔥

Reference:

• Mastering JavaScript Loops