Toán tử ba ngôi (ternary operator) JavaScript đánh giá câu lệnh và trả về một trong hai giá trị. Toán tử ba ngôi có thể chỉ định trả về giá trị nếu câu lệnh đánh giá true hoặc false. Cú pháp: câu_lệnh ? nếu_true : nếu_false;.
Có lúc bạn chỉ muốn mã nhất định chạy khi điều kiện đáp ứng.
Ví dụ, bạn có trường ngày sinh trên trang thương mại điện tử. Cũng nói chỉ cho phép khách trên 18 tuổi mua hàng. Bạn muốn kiểm tra độ tuổi trước khi dùng trang.
Kết quả tiềm năng là true hoặc false, nên dùng toán tử ba ngôi kiểm tra độ tuổi.
Trong hướng dẫn này, chúng ta thảo luận cách dùng toán tử ba ngôi. Chúng ta tham khảo ví dụ giúp bạn bắt đầu.
Toán tử ba ngôi JavaScript là gì?
Toán tử ba ngôi JavaScript, gọi là toán tử ba ngôi có điều kiện, tương tự câu lệnh if...else JavaScript. Toán tử ba ngôi kiểm tra điều kiện có đáp ứng, làm điều gì tùy thuộc điều kiện đáp ứng hay không.
Biểu thức ba ngôi có cú pháp:
(điều_kiện) ? nếu_true_thì_chạy : nếu_false_thì_chạy
Điều kiện đến trước, rồi dấu hỏi. Biểu thức đầu thực thi nếu điều kiện đáp ứng. Biểu thức thứ hai thực thi nếu điều kiện không đáp ứng.
81% người tham gia cho biết họ cảm thấy tự tin hơn về cơ hội việc làm công nghệ sau khi tham gia bootcamp. Được ghép nối với bootcamp ngay hôm nay.
Sinh viên trung bình của bootcamp dành ít hơn sáu tháng để chuyển đổi nghề nghiệp, từ khi bắt đầu bootcamp đến khi tìm được việc đầu tiên.
Quay về Cơ bản: câu lệnh if
Toán tử điều kiện cơ bản JavaScript là câu lệnh "if". Câu lệnh cho phép thực thi khối mã nếu điều kiện đáp ứng. Ngược lại, chương trình thực thi nội dung câu lệnh "else" tùy chọn.
Đây ví dụ câu lệnh if. Dùng kịch bản trang thương mại điện tử xác minh độ tuổi khách như thảo luận trước.
// Khai báo đối tượng khách
let customer = {
name: "Joe",
age: 15
}
if (customer.age >= 18) {
user_is_right_age = true;
} else {
user_is_right_age = false;
}
Câu lệnh if chạy, và user_is_right_age đặt false. Chương trình kiểm tra tuổi khách 18 trở lên. Vì người dùng không trên 18, mệnh đề else thực thi, đặt user_is_right_age thành false.
Mặc dù mã chạy, nhưng nhiều mã! Tốn năm dòng xác minh tuổi khách.
Sao nếu nói có cách thực hiện cùng chức năng chỉ một dòng? Đó là lúc toán tử ba ngôi xuất hiện.
Ví dụ Toán tử ba ngôi JavaScript
Chúng ta đơn giản câu lệnh if trước bằng toán tử ba ngôi:
user_is_right_age = customer.age >= 18 ? true : false;
Mã này, khi thực thi, cho cùng kết quả mã trên (false), nhưng ít dòng hơn. Nếu điều kiện true—tuổi người dùng 18 trở lên—chương trình trả về true.
Trong ví dụ dùng, chương trình kiểm tra người dùng độ tuổi đúng. Mã trả về false vì người dùng dưới 18—điều kiện không đáp ứng.
Chuyển ví dụ khác. Giả sử muốn kiểm tra khách trang web có đủ điều kiện giao hàng nhanh không. Làm với toán tử ba ngôi JavaScript:
let userIsExpressCustomer = true; let shippingTimeForCustomer = userIsExpressCustomer ? 48 : 72;
Toán tử ba ngôi kiểm tra người dùng khách giao hàng nhanh, sau xác định thời gian giao. Như trên, người dùng là khách giao nhanh, điều kiện true, nhận giao 48 giờ. Nếu không phải khách giao nhanh, mã false, nhận giao 72 giờ.
Toán tử ba ngôi lồng nhau (Nested)
Toán tử ba ngôi lồng nhau là toán tử ba ngôi trong toán tử ba ngôi khác. Câu lệnh hữu ích nếu muốn đánh giá nhiều phép toán. Nhưng, nhanh chóng khó đọc nếu không cẩn thận.
Giả sử công ty thương mại điện tử cung cấp ba thời gian giao: tiêu chuẩn (72), nhanh (48 giờ); và một ngày (24 giờ). Làm sao dùng toán tử ba ngôi trường hợp này, có ba lựa chọn? Dùng if...else thay không?
Đừng lo, bạn cũng dùng toán tử ba ngôi JS với ba biểu thức. Đây ví dụ trên hoạt động:
let userIsExpressCustomer = false; let userIs24HourCustomer = true; let shippingTimeForCustomer = userIsExpressCustomer ? 48 : userIs24HourCustomer ? 24 : 72;
Trong trường hợp này, thời gian giao cho khách là 24 giờ. Chương trình kiểm tra khách giao nhanh, không phải. Sau kiểm tra khách 24 giờ, là true. Vậy biến shippingTimeForCustomer gán giá trị 24.
Nếu người dùng không khách giao nhanh hoặc 24 giờ, thời gian giao 72 giờ.
Kết luận
Toán tử ba ngôi JavaScript là thay thế câu lệnh if khi muốn đánh giá điều kiện true/false. Bạn có thể nhắm nhiều toán tử ba ngôi trong toán tử khác.
Câu lệnh điều kiện như toán tử ba ngôi chạy mã nhất định chỉ khi điều kiện cụ thể đáp ứng. Chúng là thành phần chính hầu như mọi ngôn ngữ lập trình và xuất hiện hầu như mọi chương trình JavaScript bạn viết.
Bạn quan tâm học thêm JavaScript? Chúng tôi hỗ trợ. Có hướng dẫn hoàn chỉnh cách học JavaScript. Trong hướng dẫn, tìm tất cả tài nguyên cần thiết nâng cao kiến thức JavaScript.