const - JS | lectureJavaScript Fundamentals 1

Up till now, we've seen two ways of writing conditions. That is, the regular if/else statement and the switch statement. There is certainly another one, and that is the conditional ( Ternary ) operator. This one is really nice and simple. The conditional operator allows us to write something similar to an if/else statement but all in one line.

const ageJacob = 63
ageJacob >= 62 ? console.log('Jacob has reached retirement age') : console.log('Jacob is still fit to work')

The result of the above will be 'Jacob has reached retirement age' because ageJacob is 63, which is greater than 62, making the condition ageJacob >= 62 to be true.

This is essentially like writing an if/else statement all in one line. But instead of using a statement, we use this conditional operator, which is also called the ternary operator because it has three parts which are :

1. The condition ( ageJacob >= 62 )
2. The if part ( ? )
3. The else part ( : )

The conditional operator is just an operator, as the name says. Remember that an operator always produces a value. In other words, an operator is an expression. What this means is that if we have a value, we can then assign that value to a variable. So with this, we can make the ternary operator really useful to declare variables conditionally.

/**
 * statusJacob is being declared conditionally based on the condition ageJacob >= 62
 * all in one line
*/
const statusJacob = ageJacob >= 62 ? 'Jacob has reached retirement age' : 'Jacob is still fit to work'
console.log(statusJacob) // Result ==> 'Jacob has reached retirement age'

Our expression ageJacob >= 62 ? 'Jacob has reached retirement age' : 'Jacob is still fit to work' produces a value that is being stored in the variable statusJacob. Without the conditional operator, we would have to use an if/else, and with that, this wouldn't be so easy.

When we want to declare a variable inside of an if or else block we need to first declare that variable outside like this :

let status;

if(ageJacob >= 62) {
    status = 'Jacob has reached retirement age'
} else {
    status = 'Jacob is still fit to work'
}
console.log(status)

Again, we have to declare the variable outside of the if block, not inside because any variable declared inside of the if block is not available outside.

We can actually take this a little further. Since the ternary operator is really an expression that produces a value, we can use it, for example, with template literals.

console.log(`Status : ${ageJacob >= 62 ? 'Jacob has reached retirement age' : 'Jacob is still fit to work'}`)

The template literal will then use whatever result we get from ageJacob >= 62 ? 'Jacob has reached retirement age' : 'Jacob is still fit to work and then assembles the result to the final string.

To finish, it is important to mention that the ternary operator is not taught as a replacement of the if/else statement. We still need if/else all the time, for example, when we have bigger blocks of code that we need to execute based on a condition. In such a case, the ternary operator is not going to work. The ternary operator is perfect when we need to take a quick decision.