Bạn có thể sử dụng nhiều câu lệnh if...else...if, để thực hiện một câu lệnh rẽ nhánh. Tuy nhiên, đây không phải lúc nào cũng là giải pháp tốt nhất, đặc biệt khi tất cả các nhánh phụ thuộc vào giá trị của một biến duy nhất.
Bạn có thể sử dụng một câu lệnh switch xử lý chính xác tình huống này và nó thực hiện hiệu quả hơn so với các câu lệnh if...else if.
Câu lệnh switch..case trong JavaScript được sử dụng để thực thi một hoặc nhiều khối lệnh từ nhiều điều kiện. Nó gần giống với mệnh đề if..else, nhưng nó thuận tiện hơn vì nó có thể được sử dụng với số, ký tự, v.v.
Trong bài viết này, chúng ta sẽ tìm hiểu về câu lệnh switch..case trong lập trình bằng JavaScript thông qua một số các ví dụ điển hình.
Cú pháp:
Sau đây là cú pháp được sử dụng cho câu lệnh switch..case trong mã JavaScript:
switch (bieu_thuc) {
case gia_tri_1:
// Khối lệnh 1
break; //tùy chọn
case gia_tri_2:
// Khối lệnh 2
break; //tùy chọn
......
case gia_tri_n:
// Khối lệnh n
break; //tùy chọn
default:
// Khối lệnh này được thực thi
// nếu tất cả các điều kiện trên không thỏa mãn
}
Trong đó:
bieu_thuc: Là biểu thức ban đầu sẽ trả về giá trị nào đó.
case gia_tri_1, case gia_tri_2,.. case gia_tri_n: khi bieu_thuc bằng giá trị 1 (hoặc giá trị 2 hoặc giá trị thứ n) thì thực hiện khối lệnh tương ứng.
default: khi không có điều kiện nào phía trên được thực thi thì khối lệnh trong default sẽ được thực thi.
break: Đây là câu lệnh thoát khỏi chương trình.
Cách nó hoạt động:
● Đầu tiên, đánh giá biểu thức (expression) bên trong dấu ngoặc đơn sau từ khóa switch.
● Tiếp theo, so sánh kết quả của biểu thức với dấu giá trị 1, giá trị 2,… ở các nhánh case từ trên xuống dưới. Câu lệnh switch sử dụng phép so sánh chặt chẽ ( ===).
● Sau đó, thực thi câu lệnh trong nhánh case có kết quả bằng biểu thức (expression) với giá trị theo sau từ khóa case. Câu lệnh break được sử dụng để thoát khỏi câu lệnh switch. Nếu bạn bỏ qua câu lệnh break, việc thực thi mã sẽ chuyển từ nhánh case ban đầu sang nhánh tiếp theo. Nếu kết quả của biểu thức (expression) không hoàn toàn bằng với bất kỳ giá trị nào, câu lệnh switch sẽ thực thi khối lệnh trong nhánh default.
● Câu lệnh switch sẽ ngừng so sánh kết quả của biểu thức (expression) với các giá trị chữ hoa chữ thường còn lại miễn là nó tìm thấy kết quả khớp.
● Câu lệnh switch giống như câu lệnh if…else…if . Nhưng nó có cú pháp dễ đọc hơn.
Lưu đồ thuật toán của câu lệnh Switch..case trong JavaScript:
Lý do câu lệnh switch..case thường sử dụng trong JavaScript như sau:
● Cú pháp của switch rất dễ hiểu và dễ quản lý, giúp cho mã của bạn trở nên rõ ràng và dễ đọc hơn.
● Trong một số trường hợp, sử dụng switch có thể tối ưu tốc độ hơn so với sử dụng nhiều câu lệnh if..else liên tiếp.
● Switch cho phép chúng ta chuyển đổi giá trị của một biến dễ dàng và nhanh chóng.
● Nó cho phép chúng ta chọn một trong nhiều lựa chọn khác nhau dựa trên giá trị của một biến hoặc hàm.
● Switch cho phép chúng ta tách biệt các trường hợp một cách rõ ràng, giúp cho chúng ta dễ dàng theo dõi và quản lý các tình huống khác nhau.
● Switch cho phép chúng ta tái sử dụng mã dễ dàng, điều đó giúp giảm thiểu số lượng dòng mã và giảm thiểu sự phức tạp của mã.
● Sử dụng switch có thể tăng tốc độ chương trình nếu có nhiều trường hợp cần so sánh với giá trị biến.
● Cú pháp switch rất tiện dụng trong việc xử lý các trường hợp lựa chọn đơn giản, nó giúp cho mã dễ đọc và dễ hiểu hơn.
● Sử dụng switch giúp dễ dàng kiểm tra lỗi, nếu giá trị của biến không nằm trong các trường hợp được xác định, chúng ta có thể sử dụng default để xử lý.
● Khi sử dụng switch chúng ta có thể ưu tiên trường hợp cần thực hiện trước để tăng tốc độ chương trình.
Ví dụ 1: Sử dụng câu lệnh switch để lấy số ngày trong tháng.
Trước khi bắt đầu viết chương trình JavaScript bạn cần cài đặt phần mềm Notepad ++ hoặc các phần mềm, công cụ viết code khác. Viết đoạn mã sau:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Tính số ngày trong tháng bằng Switch..case JS </title>
</head>
<body>
<div style="text-align: justify;"><p><span style="color:black; font-family:Tahoma; font-size:14pt;" >
<button onclick="Tinhsongay()">Tính số ngày trong tháng</button>
<p id="ketqua"></p>
</p></span></div>
<script type="text/javascript">
function Tinhsongay () {
var nam = parseInt(prompt('Nhập năm mà bạn muốn biết số ngày chẳng hạn 2023: '));
var thang = parseInt(prompt('Nhập tháng mà bạn muốn biết số ngày: '));
var songay;
switch (thang) {
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
songay = 31;
break;
case 4:
case 6:
case 9:
case 11:
songay = 30;
break;
case 2:
// Năm nhuận
if ((nam % 4 == 0 && !(nam % 100 == 0)) || nam % 400 == 0) {
songay = 29;
} else {
songay = 28;
}
break;
default:
songay = -1; // Tháng không hợp lệ
}
document.getElementById("ketqua").innerHTML = songay;
}
</script>
</body>
</html>
Phân tích mã:
Trong ví dụ này, chúng ta có bốn trường hợp:
Nếu tháng là 1, 3, 5, 7, 8, 10, 12 thì số ngày trong tháng là 31.
Nếu tháng đó là 4, 6, 9 hoặc 11 thì số ngày trong tháng đó là 30.
Nếu tháng là 2 và năm không phải là năm nhuận thì số ngày là 28. Nếu năm là năm nhuận thì số ngày là 29.
Nếu tháng không nằm trong phạm vi hợp lệ (1-12), nhánh default sẽ thực thi và đặt biến ‘songay’ thành -1, cho biết tháng không hợp lệ.
Kết quả thực thi của chương trình Lấy số ngày trong tháng trong JavaScript như hình ảnh dưới đây:
Ví dụ 2: Sử dụng câu lệnh switch để lấy thứ trong tuần dựa trên số ngày
Trước khi bắt đầu viết chương trình JavaScript bạn cần cài đặt phần mềm Notepad ++ hoặc các phần mềm, công cụ viết code khác. Viết đoạn mã sau:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Chương trình lấy thứ trong tuần bằng Switch..case JS </title>
</head>
<body>
<div style="text-align: justify;"><p><span style="color:black; font-family:Tahoma; font-size:14pt;" >
<button onclick="LayThu()">Lấy thứ trong tuần</button>
</p></span></div>
<script type="text/javascript">
function LayThu () {
// Khởi tạo đối tượng ngày giờ
var d = new Date();
// Lấy giá trị đại diện cho thứ trong tuần
var x = d.getDay();
// Thực hiện xử lý, thông báo tên thứ trong tuần
switch (x) {
case 0:
document.write(`Hôm nay là Chủ Nhật`);
break;
case 1:
document.write(`Hôm nay là Thứ hai`);
break;
case 2:
document.write(`Hôm nay là Thứ ba`);
break;
case 3:
document.write(`Hôm nay là Thứ tư`);
break;
case 4:
document.write(`Hôm nay là Thứ năm`);
break;
case 5:
document.write(`Hôm nay là Thứ sáu`);
break;
case 6:
document.write(`Hôm nay là Thứ bảy`);
break;
}
}
</script>
</body>
</html>
Phân tích mã:
Phương thức getDay() trả về ngày trong tuần dưới dạng một số nằm giữa 0 và 6. (Chủ nhật = 0, Thứ hai = 1, Thứ ba = 2, v.v).
Sử dụng câu lệnh switch để so khớp giá trị biểu thức lấy từ phương thức getday() với từng trường hợp case của câu lệnh switch. Ứng với mỗi trường hợp thỏa mãn khối lệnh sau case đó sẽ thực thi là in ra màn hình thứ trong tuần thông qua câu lệnh document.write().
Kết quả thực thi của chương trình Lấy thứ trong tuần trong JavaScript như hình ảnh dưới đây:
Ví dụ 3: Hãy viết một chương trình để tạo một máy tính đơn giản với câu lệnh switch.
Trước khi bắt đầu viết chương trình JavaScript bạn cần cài đặt phần mềm Notepad ++ hoặc các phần mềm, công cụ viết code khác. Viết đoạn mã sau:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Chương trình máy tính đơn giản bằng Switch..case JS </title>
</head>
<body>
<div style="text-align: justify;"><p><span style="color:black; font-family:Tahoma; font-size:14pt;" >
<button onclick="Tinhtoan()">Tính phép tính</button>
</p></span></div>
<script type="text/javascript">
function Tinhtoan () {
// chương trình cho một máy tính đơn giản
var ketqua;
// lấy đầu vào của người dùng
const pheptoan = prompt('Nhập toán tử (hoặc +, -, *, / hoặc %): ');
// lấy đầu vào toán hạng
const so1 = parseFloat(prompt('Nhập toán hạng đầu tiên: '));
const so2 = parseFloat(prompt('Nhập toán hạng thứ 2: '));
switch(pheptoan) {
case '+':
ketqua = so1 + so2;
document.write(`Kết quả của phép cộng là: ${so1} + ${so2} = ${ketqua}`);
break;
case '-':
ketqua = so1 - so2;
document.write(`Kết quả của phép trừ là: ${so1} - ${so2} = ${ketqua}`);
break;
case '*':
ketqua = so1 * so2;
document.write(`Kết quả của phép nhân là: ${so1} * ${so2} = ${ketqua}`);
break;
case '/':
ketqua = so1 / so2;
document.write(`Kết quả của phép chia là: ${so1} / ${so2} = ${ketqua}`);
break;
case '%':
ketqua = so1 % so2;
document.write(`Kết quả của phép chia lấy phần dư là: ${so1} % ${so2} = ${ketqua}`);
break;
default:
document.write(`Toán tử không hợp lệ`);
break;
}
}
</script>
</body>
</html>
Đầu ra:
Nhập toán tử: +
Nhập toán hạng đầu tiên: 2
Nhập toán hạng thứ hai: 6
2 + 6 = 8
Phân tích mã:
Trong chương trình trên, người dùng được yêu cầu nhập một trong các phép tính là: + , - , *, / hoặc % và hai toán hạng thông qua prompt(). Hàm parseFloat() được sử dụng để chuyển về một giá trị số thập phân.
Sau đó, câu lệnh switch thực thi các trường hợp dựa trên đầu vào của người dùng. Sử dụng phương thức document.write() để in kết quả lên màn hình.
Kết quả thực thi của chương trình máy tính đơn giản sử dụng switch..case trong JavaScript như hình ảnh dưới đây:
