Why can I use a
ternary operator inside a JSX expression but not an
We can use a
ternary operator, also known as a
conditional operator, inside a JSX expression because it will always evaluate to a value, where as an
else if statement is not only not an expression (it’s a statement and will execute a statement based on the value of an expression), but will also not evaluate to a value.
In other words, we cannot use a statement where a value (or expression) is expected and for this reason, we cannot use statements, including the conditional
else if statements, inside a JSX expression.