Tối ưu hóa Tuyên bố chuyển đổi trong JavaScript
Câu lệnh switch là không thể thiếu cho một số tác vụ lập trình. Trong bài viết này, bạn sẽ học cách sử dụng switch
và hy vọng sẽ có được trực giác để biết khi nào bạn nên sử dụng nó.
Dấu hiệu cho biết để sử dụng switch
là khi bạn có nhiều câu lệnh if/else
liên tiếp. Hãy xem một ví dụ sử dụng if/else
, sau đó ta sẽ xem xét switch
tương đương để so sánh:
let dayIndex = new Date().getDay();
let day;
if (dayIndex === 0) {
day = 'Sunday';
}
else if (dayIndex === 1) {
day = 'Monday';
}
else if (dayIndex === 2) {
day = 'Tuesday';
}
else if (dayIndex === 3) {
day = 'Wednesday';
}
else if (dayIndex === 4) {
day = 'Thursday';
}
else if (dayIndex === 5) {
day = 'Friday';
}
else if (dayIndex === 6) {
day = 'Saturday';
};
console.log(day); // "Friday"
Bạn có biết không? JavaScript không có phương thức root để xem ngày trong tuần!
Sử dụng if/else
thực sự dài dòng và chứa rất nhiều bảng soạn sẵn không cần thiết mà switch
có thể xử lý dễ dàng:
let dayIndex = new Date().getDay();
let day;
switch (dayIndex) {
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";
break;
};
console.log(day); // "Friday"
Hầu như không có bất kỳ mã nào và nó rất tối thiểu. Điều này là do switch
nhấn mạnh vào các giá trị có thể thay vì các điều kiện cho các giá trị .
Sử dụng break
Vì JavaScript sẽ chuyển qua toàn bộ nhánh case
nhiều lần nên bạn nên sử dụng break
để ngăn chặn các case
trùng khớp không mong muốn hoặc để giúp công cụ khỏi phải phân tích cú pháp mã bổ sung.
switch (dayIndex) {
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";
break;
}
Trong ví dụ này, break
thực sự không cung cấp thêm bất kỳ sự an toàn nào vì case 2
không bao giờ có thể là case 5
(ví dụ) nên break
có phần không liên quan. Việc sử dụng break
nghiêm ngặt này dường như là một vấn đề ưu tiên giữa các nhà phát triển như việc sử dụng dấu chấm phẩy (;). Các nhà phát triển có cách tiếp cận rõ ràng để lập trình sẽ sử dụng break
cho mọi case
, trong khi một số nhà phát triển chỉ sử dụng break
chiến lược trong switch
. Tuy nhiên, có một chút tăng hiệu suất khi sử dụng nó trên bảng, bởi vì ngay cả khi không có cơ hội cho một trường hợp khác đúng, thì ít nhất bạn thậm chí sẽ không để động cơ chạy qua phần còn lại của câu lệnh chuyển đổi.
Sử dụng chiến lược của "break"
Đôi khi bạn thực sự muốn các trường hợp của bạn "lọt lưới". Sử dụng break
cho những trường hợp này là một chiến lược hơn là một biện pháp an toàn.
let seasonIndex = new Date().getMonth();
let season;
switch (seasonIndex) {
case 0:
case 1:
case 2:
season = 'Winter'; // January, February, March
break;
case 3:
case 4:
case 5:
season = 'Spring'; // April, May, June
break;
case 6:
case 7:
case 8:
season = 'Summer'; // July, August, September
break;
case 9:
case 10:
case 11:
season = 'Autumn'; // October, November, December
break;
}
Trong ví dụ này, các trường hợp là "thông qua" và break
được sử dụng để thoát khỏi switch
sớm một cách rõ ràng. Điều này cho phép bạn gộp nhiều trường hợp lại với nhau với một giá trị duy nhất.
Phiên bản if/else
sẽ yêu cầu sử dụng nhiều ||
toán tử logic có vẻ không minh bạch:
if (seasonIndex === 0 || seasonIndex === 1 || seasonIndex === 2) {
season = 'Winter';
} else if (seasonIndex === 3 || seasonIndex === 4 || seasonIndex === 5) {
season = 'Spring';
} else if (seasonIndex === 6 || seasonIndex === 7 || seasonIndex === 8) {
season = 'Summer';
} else if (seasonIndex === 9 || seasonIndex === 10 || seasonIndex === 11) {
season = 'Fall';
}
Xử lý các trường hợp mặc định
Một tính năng khác của switch
là khả năng xử lý các trường hợp đột xuất hoặc chung chung. Quay trở lại ví dụ đầu tiên của ta , ta có thể sử dụng default
để triển khai xử lý lỗi:
let dayIndex = new Date().getDay();
let day;
switch (dayIndex) {
default:
day = new Error('Invalid argument: "dayIndex" must be an integer from 0 –> 6');
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';
break;
}
Bạn có thể nhận thấy rằng trường hợp default
được đặt ở trên cùng. Đừng lo lắng! Nó sẽ hoạt động như mong đợi vì JavaScript sẽ xem xét tất cả các nhánh case
trước khi nó giải quyết theo default
.
Bạn cũng có thể sử dụng default
cho các trường hợp chung của bạn :
let beverage = 'Mr. Pibb';
let cost;
switch (beverage) {
default:
cost = 0.05;
case 'Pepsi':
cost = 1.00;
break;
case 'Coca-Cola':
cost = 1.00;
break;
case 'Dr. Pepper':
cost = 2.00;
break;
case 'Moutain Dew':
cost = 5.00;
break;
}
console.log(cost); // 0.05
Điều này đảm bảo bạn sẽ nhận được một số giá trị sorta từ switch
ngay cả khi nó không trùng với bất kỳ cases
nào bạn đã xác định.
Kết luận
Câu lệnh switch là một sự thay thế thanh lịch khi bạn thấy mình đang viết nhiều câu lệnh if/else
liên tiếp. Mặc dù bạn có thể không sử dụng switch
thường xuyên, nhưng ví dụ, for-loop
không có sự thay thế khi bạn cần. Các thư viện thư viện hiện đại như Lodash và Redux vẫn sử dụng switch
đến ngày nay, khiến nó trở thành một trong những tính năng cũ của JavaScript mà bạn sẽ luôn cần phải tuân theo.
Để tìm hiểu thêm về switch
hãy truy cập trang web Nhà phát triển Mozilla .
Các tin liên quan
Làm việc với Singletons trong JavaScript2019-04-19
Cách sử dụng Axios với JavaScript
2019-04-05
Giới thiệu về Lặp lại và Trình lặp trong JavaScript
2019-03-13
D3.js: Hiểu các lựa chọn và so sánh với Vanilla JavaScript
2019-03-04
Xem xét Phạm vi, Ngữ cảnh, Tham chiếu Đối tượng và Thuyết minh trong JavaScript
2019-02-25
Sử dụng JavaScript Mixins
2019-02-12
Đọc mã nguồn JavaScript, sử dụng AST
2019-02-09
JavaScript Biểu thức chính quy cho Người bình thường
2019-02-07
Mẫu kế thừa nguyên mẫu JavaScript
2019-02-01
Các mẫu hướng đối tượng JavaScript: Mẫu nhà máy
2019-01-23