Vòng lặp trong JavaScript

Vòng lặp là một trong những công cụ quan trọng trong lập trình, giúp lặp đi lặp lại một khối mã mà không cần viết lại nhiều lần. JavaScript hỗ trợ nhiều loại vòng lặp:

• for: Lặp theo số lần xác định.
• while: Lặp khi một điều kiện còn đúng.
• do-while: Chạy ít nhất một lần, sau đó kiểm tra điều kiện.
• forEach: Dùng để lặp qua mảng.

Mục tiêu bài học:

• Hiểu và sử dụng các loại vòng lặp trong JavaScript.
• Biết cách dừng vòng lặp (break) hoặc bỏ qua lần lặp (continue).
• Ứng dụng vòng lặp để duyệt danh sách sản phẩm.

Vòng lặp trong JavaScript

1. Vòng lặp for

Dùng khi biết trước số lần lặp.

Cú pháp

for (khởi_tạo; điều_kiện; bước_nhảy) {
    // Code thực thi trong mỗi lần lặp
}

Ví dụ: In ra số từ 1 đến 5

for (let i = 1; i <= 5; i++) {
    console.log("Số:", i);
}

Lưu ý:

• let i = 1: Khởi tạo biến đếm.
• i <= 5: Điều kiện tiếp tục vòng lặp.
• i++: Mỗi lần lặp, tăng i lên 1.

2. Vòng lặp while

Dùng khi không biết trước số lần lặp, chỉ cần điều kiện đúng thì tiếp tục chạy.

Cú pháp

while (điều_kiện) {
    // Code thực thi khi điều kiện đúng
}

Ví dụ: In ra số từ 1 đến 5

let i = 1;
while (i <= 5) {
    console.log("Số:", i);
    i++;
}

Lưu ý:

• Nếu i không tăng trong vòng lặp, nó sẽ chạy vô hạn.
• Dùng while khi chưa biết trước số lần lặp.

3. Vòng lặp do-while

Giống while, nhưng đảm bảo chạy ít nhất một lần, ngay cả khi điều kiện sai.

Cú pháp

do {
    // Code thực thi ít nhất một lần
} while (điều_kiện);

Ví dụ: Chạy ít nhất một lần dù điều kiện sai

let i = 10;
do {
    console.log("Giá trị i:", i);
    i++;
} while (i <= 5);

Lưu ý:

• do-while phù hợp khi muốn đảm bảo code chạy ít nhất một lần trước khi kiểm tra điều kiện.

4. Vòng lặp forEach (Duyệt mảng)

Dùng để lặp qua từng phần tử của mảng.

Cú pháp

array.forEach((element, index) => {
    // Code thực thi cho mỗi phần tử
});

Ví dụ: In danh sách tên sản phẩm

let products = ["Laptop", "Điện thoại", "Máy tính bảng"];

products.forEach((product, index) => {
    console.log(`Sản phẩm ${index + 1}: ${product}`);
});

Lưu ý:

• forEach chỉ dùng với mảng, không hỗ trợ break hoặc continue.

5. Thoát vòng lặp với break và continue

• break: Dừng vòng lặp ngay lập tức.
• continue: Bỏ qua lần lặp hiện tại, tiếp tục vòng lặp kế tiếp.

Ví dụ: Dừng khi gặp số 3 (break)

for (let i = 1; i <= 5; i++) {
    if (i === 3) {
        break; // Dừng vòng lặp khi i = 3
    }
    console.log("Số:", i);
}
// Output: 1, 2

Ví dụ: Bỏ qua số 3 (continue)

for (let i = 1; i <= 5; i++) {
    if (i === 3) {
        continue; // Bỏ qua số 3
    }
    console.log("Số:", i);
}
// Output: 1, 2, 4, 5

6. Ví dụ thực tế: Lặp qua danh sách sản phẩm

Giả sử chúng ta có danh sách sản phẩm và muốn tìm sản phẩm có giá thấp nhất.

let products = [
    { name: "Laptop", price: 1500 },
    { name: "Điện thoại", price: 800 },
    { name: "Máy tính bảng", price: 1200 }
];

let minPrice = products[0].price;
let cheapestProduct = products[0].name;

for (let i = 1; i < products.length; i++) {
    if (products[i].price < minPrice) {
        minPrice = products[i].price;
        cheapestProduct = products[i].name;
    }
}

console.log(`Sản phẩm rẻ nhất: ${cheapestProduct} - Giá: $${minPrice}`);

Giải thích:

• Duyệt từng sản phẩm, so sánh giá.
• Cập nhật sản phẩm có giá thấp nhất.

Kết luận

• for: Dùng khi biết trước số lần lặp.
• while: Dùng khi không biết trước số lần lặp.
• do-while: Đảm bảo chạy ít nhất một lần.
• forEach: Duyệt qua từng phần tử của mảng.
• break: Dừng vòng lặp ngay lập tức.
• continue: Bỏ qua lần lặp hiện tại.
• Ứng dụng thực tế: Duyệt danh sách sản phẩm, tìm giá thấp nhất.