Ternary Operator
The ternary operator is a shorthand way to write simple if-else statements. It's called "ternary" because it takes three operands (parts).
Basic Syntax
const age = 18
age >= 18 ? "trueValue" : "falseValue"
Think of ? as "if" and : as "else". If the condition before ? is true, it returns the value after the ?; otherwise, it returns the value after the :.
Ternaries Return Values
Another useful feature of the ternary operator is that it always returns a value. This makes it great for assignments:
// Traditional if-else
let message
if (age >= 18) {
message = "You can vote"
} else {
message = "You cannot vote"
}
// Ternary operator
const message = age >= 18 ? "You can vote" : "You cannot vote"
Chaining Ternary Operators
You can chain multiple ternaries together, but be careful as it can get hard to read:
// This works but can be hard to read
const grade = score >= 90 ? "A" : score >= 80 ? "B" : score >= 70 ? "C" : "F"
// If-else is clearer
let grade
if (score >= 90) {
grade = "A"
} else if (score >= 80) {
grade = "B"
} else if (score >= 70) {
grade = "C"
} else {
grade = "F"
}
When to Use Ternary Operators
✅ Good for:
- Simple conditions with two outcomes
- Assigning values based on conditions
- Short, readable expressions
❌ Avoid for:
- Complex conditions
- Multiple statements in each branch
- Nested ternary operators
Exercise
Convert this if-else statement to a ternary operator:
let weather
if (temperature > 75) {
weather = "hot"
} else {
weather = "not hot"
}
Solutions
const weather = temperature > 75 ? "hot" : "not hot"