So the last avenue of conditional programming in JavaScript is the ternary operator - ? :
, also known as the conditional operator.
So let's explore the ternary operator.
What is it?
You might remember from the Operators chapter that there are three types of operators based on the number of operands they can take - unary (takes one), binary (takes two) and ternary (takes three).
So as the name implies the ternary operator
So the meaning out of the way let's explore how the ternary operator works.
So as the name implies the ternary operator
? :
takes three operands - one before the operand, one between it and one after it.
operand1?operand2:operand3
So the meaning out of the way let's explore how the ternary operator works.
How it works?
The ternary operator takes its first operand, evaluates its value - if it's true the second operand is returned - if it is false the third operand is returned.
See this syntax for better understanding
Let's even see this in action.
So above, since
And here, since
See this syntax for better understanding
condition?expression1:expression1
Where:
- expression1 is the expression to be evaluated and returned when the condition is true.
- expression2 is the expression to be evaluated and returned when the condition is false.
Let's even see this in action.
var id = 1;
var item = (id == 1) ? "Football" : "Tennis Racket";
console.log(item); // Football
id
is equal to 1 i.e the condition is met, therefore the second operand - Football
is returned.var id = 2;
var item = (id == 1) ? "Football" : "Tennis Racket";
console.log(item); // Tennis Racket
id
is not equal to 1 i.e the condition is not met, therefore the third operand - Tennis Racket
is returned.When to use it?
Considering the fact that there are if and switch statements present in JavaScript for conditional statements why would any one go for the ternary/conditional operator?
The ternary operator is handy:
Well generally speaking you could use the
The ternary operator is handy:
- When you have only two things to do after a certain condition is checked - one when the condition is true and one when the condition is false. This is different from the if statements where you can nest more
if
's and even addelse if
's just because you have a whole lot of conditions to test. - When there are not complex multiple statements to be executed after condition evaluation. The ternary operator is given to add simplicity to conditional programming and therefore isn't meant to handle complex statements in the second and third operands.
Well generally speaking you could use the
if
family of statements and even the switch
statement to condition-check code instead of the ternary operator, but to some it seems unreasonably long.
Conclusion
With this chapter our JavaScript Conditions unit comes to an end, but not conditional programming. We will use conditions in the next unit also which means you are not done with it!
Take your time to understand or review any thing you didn't understand in this unit or have forgotten respectively because the next unit will be accelerating the ideas and concepts laid out by this unit.
Take your time to understand or review any thing you didn't understand in this unit or have forgotten respectively because the next unit will be accelerating the ideas and concepts laid out by this unit.