Xem thêm

Vòng lặp while và do...while trong JavaScript

Huy Erick
Trong lập trình, vòng lặp được sử dụng để lặp lại một khối mã. Ví dụ, nếu bạn muốn hiển thị một thông báo 100 lần, bạn có thể sử dụng vòng lặp. Đây chỉ...

Trong lập trình, vòng lặp được sử dụng để lặp lại một khối mã. Ví dụ, nếu bạn muốn hiển thị một thông báo 100 lần, bạn có thể sử dụng vòng lặp. Đây chỉ là một ví dụ đơn giản; bạn có thể thực hiện nhiều công việc hơn với vòng lặp.

Trong bài hướng dẫn trước đó, bạn đã tìm hiểu về vòng lặp for trong JavaScript. Ở đây, bạn sẽ tìm hiểu về vòng lặp while và do...while.

Vòng lặp while trong JavaScript

Cú pháp của vòng lặp while như sau:

while (condition) {
    // khối mã trong vòng lặp
}

Ở đây:

  1. Vòng lặp while đánh giá điều kiện trong dấu ngoặc đơn ().
  2. Nếu điều kiện đánh giá là true, mã bên trong vòng lặp while sẽ được thực thi.
  3. Điều kiện được đánh giá lại.
  4. Quá trình trên tiếp tục cho đến khi điều kiện trở thành false.
  5. Khi điều kiện trở thành false, vòng lặp dừng lại.

Để tìm hiểu thêm về các điều kiện, hãy ghé thăm các toán tử so sánh và logic trong JavaScript.

Sơ đồ luồng của vòng lặp while

Flowchart of JavaScript while loop Hình ảnh minh họa vòng lặp while trong JavaScript

Ví dụ 1: Hiển thị các số từ 1 đến 5

// chương trình để hiển thị các số từ 1 đến 5
// khởi tạo biến
let i = 1, n = 5;

// vòng lặp while từ i = 1 đến 5
while (i <= n) {
    console.log(i);
    i += 1;
}

Kết quả:
1
2
3
4
5

Dưới đây là cách chương trình này hoạt động.

### Ví dụ 2: Tổng các số dương

```javascript
// chương trình để tìm tổng các số dương
// nếu người dùng nhập một số âm, vòng lặp sẽ kết thúc
// số âm nhập vào không được cộng vào tổng
let sum = 0;

// lấy dữ liệu từ người dùng
let number = parseInt(prompt('Nhập một số: '));

while(number >= 0) {
    // cộng tất cả các số dương
    sum += number;

    // lấy dữ liệu lại nếu số là dương
    number = parseInt(prompt('Nhập một số: '));
}

// hiển thị tổng
console.log(`Tổng là ${sum}.`);


Kết quả:
Nhập một số: 2
Nhập một số: 5
Nhập một số: 7
Nhập một số: 0
Nhập một số: -3
Tổng là 14.

Trong chương trình trên, người dùng được nhắc nhập một số.
Ở đây, sử dụng parseInt () vì prompt () nhận dữ liệu đầu vào từ người dùng dưới dạng chuỗi. Khi chuỗi số được cộng, nó sẽ thực hiện như một chuỗi. Ví dụ, '2' + '3' = '23'. Vì vậy, parseInt () chuyển đổi chuỗi số thành số.
Vòng lặp while tiếp tục cho đến khi người dùng nhập một số âm. Trong mỗi lần lặp, số nhập vào bởi người dùng được cộng vào biến tổng.
Khi người dùng nhập một số âm, vòng lặp kết thúc. Cuối cùng, tổng tổng được hiển thị.

## Vòng lặp do...while trong JavaScript

Cú pháp của vòng lặp do...while như sau:

```javascript
do {
    // khối mã trong vòng lặp
} while(condition)

Ở đây:

  1. Khối mã trong vòng lặp được thực thi lúc đầu. Sau đó, điều kiện được đánh giá.
  2. Nếu điều kiện đánh giá là true, khối mã trong vòng lặp bên trong câu lệnh do sẽ được thực thi lại.
  3. Điều kiện được đánh giá một lần nữa.
  4. Nếu điều kiện đánh giá là true, khối mã trong vòng lặp bên trong câu lệnh do sẽ được thực thi lại.
  5. Quá trình này tiếp tục cho đến khi điều kiện đánh giá trở thành false. Sau đó, vòng lặp dừng lại.

Lưu ý: Vòng lặp do...while giống với vòng lặp while. Sự khác biệt duy nhất là ở vòng lặp do...while, khối mã của vòng lặp sẽ được thực thi ít nhất một lần.

Sơ đồ luồng của vòng lặp do...while

Flowchart of do...while loop in JavaScript Hình ảnh minh họa vòng lặp do...while trong JavaScript

Hãy xem cách vòng lặp do...while hoạt động.

Ví dụ 3: Hiển thị các số từ 1 đến 5

// chương trình để hiển thị các số
let i = 1;
const n = 5;

// vòng lặp do...while từ 1 đến 5
do {
    console.log(i);
    i++;
} while(i <= n);

Kết quả:
1
2
3
4
5

Dưới đây là cách chương trình này hoạt động.

### Ví dụ 4: Tổng các số dương

```javascript
// để tìm tổng các số dương
// nếu người dùng nhập số âm, vòng lặp kết thúc
// số âm không được cộng vào tổng
let sum = 0;
let number = 0;

do {
    sum += number;
    number = parseInt(prompt('Nhập một số: '));
} while(number >= 0)

console.log(`Tổng là ${sum}.`);

Kết quả 1:
Nhập một số: 2
Nhập một số: 4
Nhập một số: -500
Tổng là 6.

Ở đây, vòng lặp do...while tiếp tục cho đến khi người dùng nhập một số âm. Khi số là âm, vòng lặp kết thúc; số âm không được cộng vào biến tổng.

Kết quả 2:
Nhập một số: -80
Tổng là 0.

Khối mã của vòng lặp do...while chỉ chạy một lần nếu người dùng nhập một số âm.

Vòng lặp while vô hạn

Nếu điều kiện của một vòng lặp luôn đúng, vòng lặp sẽ chạy vô hạn (cho đến khi bộ nhớ đầy). Ví dụ,

```javascript
// vòng lặp while vô hạn
while(true){
    // khối mã trong vòng lặp
}

Dưới đây là một ví dụ về vòng lặp do...while vô hạn.

// vòng lặp do...while vô hạn
const count = 1;
do {
    // khối mã trong vòng lặp
} while(count == 1)

Trong các chương trình trên, điều kiện luôn luôn đúng. Do đó, khối mã vòng lặp sẽ chạy vô hạn.

## Vòng lặp for vs while

Vòng lặp for thường được sử dụng khi số lần lặp đã biết trước. Ví dụ,

```javascript
// vòng lặp này được lặp lại 5 lần
for (let i = 1; i <= 5; ++i) {
    // khối mã trong vòng lặp
}

Và vòng lặp while và do...while thường được sử dụng khi số lần lặp không biết trước. Ví dụ,

while (condition) {
    // khối mã trong vòng lặp
}
1