JavaScript Switch Statement - Câu lệnh switch JavaScript
Các câu lệnh switch
được sử dụng để thực hiện các hành động khác nhau dựa trên các điều kiện khác nhau.
Câu lệnh switch JavaScript
Dùng câu lệnh switch
để chọn một trong nhiều khối code để thực thi.
Cú pháp
switch(expression) {
case x:
// code block
break;
case y:
// code block
break;
default:
// code block
}
Đây là cách mà nó hoạt động:
- Biểu thức(expression) switch được ước tính một lần.
- Giá trị của biểu thức(expression) được so sánh với các giá trị của mỗi case.
- Nếu có một giá trị phù hợp, khối code liên quan sẽ được thực thi.
- Nếu không có một giá trị phù hợp, khối code default được thực thi.
ví dụ
Phương thức getDay()
trả về các thứ trong tuần như một số giữa 0 và 6.
(Chủ nhật =0, thứ hai=1, thứ ba =2 ..)
Ví dụ này sử dụng số thứ trong tuần để tính tên của thứ đó:
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
}
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var day;
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
}
document.getElementById("demo").innerHTML = "Today is " + day;
</script>
</body>
</html>
Kết quả sẽ là:
Monday
Từ khóa break
Khi JavaScript chạm đến từ khóa break
, nó sẽ thoát ra khỏi khối switch.
Điều này sẽ dừng viêc thực thi bên trong khối.
Không cần thiết dừng case cuối trong khối switch. Dù sao khối sẽ dừng(kết thúc) ở đó.
Ghi chú: Nếu bạn bỏ qua câu lệnh break, case tiếp theo sẽ được thực thi ngay cả khi điều kiện không đúng với case.
Từ khóa default
Từ khóa default
chỉ định code để chạy nếu không có case nào phù hợp:
ví dụ
Phương thức getDay()
trả về các thứ trong tuần như một số giữa 0 và 6.
Nếu hôm này không phải thứ bảy(6) hoặc chủ nhật(0), viết một thông điệp default:
switch (new Date().getDay()) {
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript switch</h2>
<p id="demo"></p>
<script>
var text;
switch (new Date().getDay()) {
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Kết quả sẽ là:
Looking forward to the Weekend
Trường hợp default
không cần phải là trường hợp cuối cùng trong một khối switch
ví dụ
switch (new Date().getDay()) {
default:
text = "Looking forward to the Weekend";
break;
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
}
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript switch</h2>
<p id="demo"></p>
<script>
var text;
switch (new Date().getDay()) {
default:
text = "Looking forward to the Weekend";
break;
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Tip: Nếu default
không phải là case cuối cùng trong khối switch, hãy nhớ kết thúc default với một break.
Các khối code phổ biến
Đôi khi bạn sẽ muốn các trường hợp switch đều dùng một code giống nhau.
Trong trường hợp này case 4 và case 5 chia sẻ chung một khối code, và 0 và 6 chia sẽ một khối code khác:
ví dụ
switch (new Date().getDay()) {
case 4:
case 5:
text = "Soon it is Weekend";
break;
case 0:
case 6:
text = "It is Weekend";
break;
default:
text = "Looking forward to the Weekend";
}
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript switch</h2>
<p id="demo"></p>
<script>
var text;
switch (new Date().getDay()) {
case 4:
case 5:
text = "Soon it is Weekend";
break;
case 0:
case 6:
text = "It is Weekend";
break;
default:
text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Chi tiết về switch(Switching Details)
Nếu nhiều case phù hợp với giá trị của case cần tìm, case đầu tiên sẽ được lựa chọn.
Nếu không có case nào được tìm thấy, chương trình sẽ tiếp tục dến nhãn default.
Nếu không thấy nhãn default, chương trình sẽ tiếp tục (các)câu lệnh sau switch.
So sánh chặt chẽ
Các switch case sử dụng so sánh chặt chẽ (===).
Các giá trị phải cùng kiểu để phù hợp.
Một so sánh chặt chẽ chỉ có thể đúng nếu các toán hạng đều có chung một kiểu.
Trong ví dụ này sẽ không có kết quả phù hợp cho x:
ví dụ
var x = "0";
switch (x) {
case 0:
text = "Off";
break;
case 1:
text = "On";
break;
default:
text = "No value found";
}
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript switch</h2>
<p id="demo"></p>
<script>
var x = "0";
switch (x) {
case 0:
text = "Off";
break;
case 1:
text = "On";
break;
default:
text = "No value found";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)