Kịch bản thuyết trình: Slides 92, 93, 94

Mình tiếp tục với slide 92, 93 và 94 về JavaScript Switch Statement.

Switch là gì?

switch cũng là một câu lệnh điều kiện, giống như if...else, nhưng nó được dùng khi bạn cần so sánh một biến (hoặc biểu thức) với nhiều giá trị khác nhau.

Cú pháp gọn gàng, dễ đọc hơn khi có nhiều case, và nó sẽ thực thi đoạn code tương ứng khi có giá trị khớp – thay thế cho việc dùng nhiều if...else if...else.

Cú pháp chung

switch (expression) {
    case value1:
        // expression === value1 の場合にコードを実行
        break;
    case value2:
        // expression === value2 の場合にコードを実行
        break;
    default:
        // どの case にも一致しない場合にコードを実行
}

Giải thích từng phần và luồng chạy trong câu lệnh switch

switch (expression)

expression là một biểu thức hoặc giá trị cần so sánh. JavaScript sẽ so sánh giá trị này với từng case.

case value1:

Đây là một "trường hợp" cụ thể để so sánh.

=== là toán tử so sánh cả giá trị và kiểu dữ liệu. expression === value1 nghĩa là expression và value1 đều giống nhau 100%.

Nếu expression === value1, thì code ngay dưới case value1: sẽ được thực thi.

Sau khi chạy xong, gặp break; thì thoát khỏi switch.

case value2:

Tương tự case value1.

Nếu expression === value2, thì đoạn code trong nhánh này chạy, sau đó break để thoát.

break;

Dùng để kết thúc lệnh switch tại case khớp, tránh chạy tiếp xuống dưới.

Nếu bỏ break, chương trình sẽ tiếp tục chạy xuống các case tiếp theo (hiện tượng này gọi là fall-through).

default:

Tuỳ chọn (không bắt buộc).

Code trong default sẽ chạy nếu không có case nào khớp.

Giống như else trong if...else.

Ví dụ

let color = "red";

switch (color) {
    case "blue":
        console.log("Blue");
        break;
    case "red":
        console.log("Red");
        break;
    case "green":
        console.log("Green");
        break;
}
// Output Result: red

Giải thích luồng chạy:

1. Biến color có giá trị là "red".
2. Switch so sánh color với từng case theo thứ tự:
   • case "blue": color === "blue" ? → false, bỏ qua phần này.
   • case "red": color === "red" ? → true, thực thi console.log("Red");, sau đó gặp break nên thoát khỏi switch.
   • case "green": Không được thực thi vì đã thoát switch ở case "red".
3. Kết quả: In ra "Red".

Như vậy là mình đã trình bày xong về Switch Statement trong JavaScript - một cách gọn gàng để xử lý nhiều điều kiện so sánh với cùng một biến.