Câu lệnh chuyển đổi JavaScript – Với mã ví dụ trường hợp chuyển đổi JS

Tạo các điều kiện để quyết định hành động nào sẽ thực hiện là một trong những phần cơ bản nhất của lập trình trong JavaScript. Hướng dẫn này sẽ giúp bạn tìm hiểu cách tạo nhiều điều kiện bằng cách sử dụng switch từ khóa.

Cách câu lệnh chuyển đổi hoạt động trong JavaScript

JavaScript switch từ khóa được sử dụng để tạo nhiều câu lệnh có điều kiện, cho phép bạn thực thi các khối mã khác nhau dựa trên các điều kiện khác nhau.

Đoạn mã dưới đây cho bạn thấy một switch tuyên bố trong hành động:

var score = 20;

switch(age){
    case 10:
        console.log("Score value is 10");
        break;
    case 20:
        console.log("Score value is 20");
        break;
    default:
        console.log("Score value is neither 10 or 20");
}

Đoạn mã trên sẽ in "Score value is 20" đến bàn điều khiển. Câu lệnh switch hoạt động bằng cách so sánh một expression đưa ra cho nó với các biểu thức trong mỗi case khoản.

Trước tiên, bạn cần phải vượt qua một expression vào switch câu lệnh, sau đó được đặt trong một cặp dấu ngoặc tròn (). Bạn có thể chuyển một biến hoặc một giá trị bằng chữ như hình bên dưới:

var age = 29;

switch(age){}
// or
switch(true){}
switch("A string"){}
switch(5+5){}

Các expression sẽ được đánh giá một lần và sau đó được so sánh với các biểu thức mà bạn xác định trong mỗi case khoản, từ trên xuống dưới.

Trong ví dụ sau, các switch câu lệnh sẽ đánh giá giá trị của biến flower và sau đó so sánh nó với từng case mệnh đề để xem nó có trả về không true:

• đầu tiên case sẽ so sánh nếu flower === "rose"
• Thư hai case sẽ so sánh nếu flower === "violet"
• thứ ba case sẽ so sánh nếu flower === "sunflower"
• Khi cả ba case điều khoản trở lại false các default trường hợp sẽ được thực hiện

var flower = "tulip";

switch (flower){
    case "rose":
        console.log("Roses are red");
        break;
    case "violet":
        console.log("Violets are blue");
        break;
    case "sunflower":
        console.log("Sunflowers are yellow");
        break;
    default:
        console.log("Please select another flower");
}

Các default trường hợp là tùy chọn, có nghĩa là bạn có thể chỉ cần chạy qua switch câu lệnh mà không tạo ra bất kỳ đầu ra nào. Nhưng tốt hơn hết là bao gồm một default trường hợp để bạn biết switch câu lệnh được thực thi đúng bởi JavaScript.

Bạn chỉ có thể bao gồm một default trường hợp trong một switch câu lệnh, nếu không JavaScript sẽ báo lỗi.

Cuối cùng, bạn cần bao gồm break từ khóa trong mỗi case phần thân của mệnh đề để ngăn chặn switch thực thi câu lệnh sau khi tìm thấy một trường hợp phù hợp. Nếu bạn bỏ qua break từ khóa, JavaScript sẽ tiếp tục đánh giá biểu thức cho đến lần cuối cùng case khoản.

Đoạn mã sau sẽ in cả hai "Roses are red" và "Please select another flower" bởi vì break từ khóa được bỏ qua từ case mệnh đề, khiến JavaScript tiếp tục so sánh biểu thức xuống trường hợp cuối cùng, đó là default trường hợp:

var flower = "rose";

switch (flower){
    case "rose":
        console.log("Roses are red");
    case "violet":
        console.log("Violets are blue");
    case "sunflower":
        console.log("Sunflowers are yellow");
    default:
        console.log("Please select another flower");
}

Ngay cả khi biểu hiện "rose" đã tìm thấy một trận đấu trong lần đầu tiên case mệnh đề, JavaScript vẫn tiếp tục chạy switch tuyên bố bởi vì không có break từ khóa.

Lưu ý: không cần break từ khóa trong trường hợp cuối cùng, bởi vì switch tuyên bố sẽ được thực hiện hoàn toàn bởi sau đó.

Tóm lại, đây là cách một switch tuyên bố hoạt động:

• Đầu tiên, bạn cần một expression mà bạn muốn so sánh với một số điều kiện.
• Sau đó, bạn viết tất cả các điều kiện để so sánh với expression trong mỗi case khoản, bao gồm một default trường hợp không khớp case
• Cuối cùng, viết mã mà bạn muốn thực thi bên trong mỗi casetiếp theo là break từ khóa để ngăn JavaScript so sánh thêm expression với case điều khoản.

Bây giờ bạn đã biết làm thế nào switch câu lệnh hoạt động, hãy tìm hiểu khi nào bạn nên sử dụng switch tuyên bố thay vì một if..else bản tường trình.

Khi nào thì sử dụng câu lệnh switch

cả hai switch tuyên bố và if..else câu lệnh được sử dụng để tạo điều kiện. Nguyên tắc chung là switch tuyên bố chỉ được sử dụng khi bạn có một giá trị chính xác cho câu điều kiện.

Điều này là do một if..else tuyên bố có thể được sử dụng để so sánh một expression với một giá trị không chính xác chẳng hạn như lớn hơn hoặc nhỏ hơn:

var score = 70;

if(score > 50){
  console.log("Score is higher than 50");
} else {
  console.log("Score is 50 or lower");
}

Nhưng bạn không thể sử dụng score > 50 như một điều kiện để case khoản. Ví dụ sau sẽ in default trường hợp mặc dù score > 50:

var score = 70;

switch(score){
    case score > 50:
        console.log("Score is higher than 50");
        break;
    default:
        console.log("Score is 50 or lower");
}

Nếu bạn muốn đánh giá một giá trị không chính xác bằng cách sử dụng switch tuyên bố, bạn cần phải tạo một giải pháp thay thế bằng cách đánh giá một true biểu thức như trong đoạn mã dưới đây:

var score = 70;

switch(true){
    case score > 50:
        console.log("Score is higher than 50");
        break;
    default:
        console.log("Score is 50 or lower");
}

Trong khi mã ở trên sẽ hoạt động, tốt hơn là sử dụng một if..else vì nó dễ đọc hơn.

Cảm ơn đã đọc hướng dẫn này

Bạn cũng có thể quan tâm đến các hướng dẫn JavaScript khác mà tôi đã viết, bao gồm Tìm độ dài chuỗi JavaScript và Cách viết hoa chữ cái đầu tiên của chuỗi. Chúng là một số vấn đề về JavaScript thường gặp nhất mà mọi người gặp phải hàng ngày.

Tôi cũng có một bản tin miễn phí về hướng dẫn phát triển web (chủ yếu liên quan đến JavaScript).