When should one use the Javascript conditional operator?

Question

Righto, so I have come across this in a lot of code that I have read and I understand the functional role of the conditional operator in Javascript; what I do not understand is when one should use it.

I have read the ECMAScript Specification 5.1 on it, but it doesn't help me a great deal in deciding when to impliment it.

For example, I can quite easily see the benefit of replacing the code:

if (isTrue == true) {
  doSomething();
}
else {
  doSomethingElse();
}

With next:

isTrue ? doSomething() : doSomethingElse()

Where I fall down is when either the code inside the if... else... statement is lengthy or the conditional operator is nested inside (an)other conditional operator(s). The obvious candidate for deciding when to use which version of the conditional statement is "does replacing it with the conditional operator make the code easier to follow?". Unfortunately I am rather inexperienced with writing code and I am unsure of when this is and I'm biased by understanding my own code well, no matter how poorly written it may be.

Can anybody with significantly more experience than me give me a slightly less subjective test for when you use it, so that I can attempt to follow suit?

Related: JS How to use the ?: (ternary) operator

You *can* use it for statements, but I'd leave that to the minifiers. I only use it in expressions. — Joe White, Apr 01 '15 at 16:38
There's really not more to this than "use the coding technique that makes your code the clearest, cleanest and easiest to understand and maintain". Sometimes the ternary operator makes things cleaner and sometimes it just makes things harder to read. Part of becoming a more experienced programmer is recognizing when code is not clear and improving it by using a different technique and knowing which technique to choose when you first write the code. — jfriend00, Apr 01 '15 at 17:07

Bruno Toffolo · Answer 1 · 2015-04-01T16:45:24.957

3

I think it is useful for code legibility and simplicity in attributions. Which one is easier to read? :)

var numberType = (number % 2 == 0) ? "even" : "odd";

// or

var numberType;
if (number % 2 == 0) {
    numberType = "even";
} else {
    numberType = "odd";
}

edited Apr 01 '15 at 16:45

answered Apr 01 '15 at 16:40

Bruno Toffolo

1,504
19
24

2

or what about `var isResultCorrect = (my_output == desired_output);` – ps2goat Apr 01 '15 at 16:41
Ok, if you would be that pedant please consider another example such as `var numberType = (number % 2 == 0) ? "even" : "odd" ;`. – Bruno Toffolo Apr 01 '15 at 16:42
The "even" : "odd" example is much better that what you have in your answer. I would suggest you edit your answer to replace what you have with the even/odd example. – jfriend00 Apr 01 '15 at 16:44
Edited. The main point is the same, but thank you for the suggestion. – Bruno Toffolo Apr 01 '15 at 16:45

score 1 · Accepted Answer · answered Apr 01 '15 at 16:41

Ternary operator was designed to replace

if (test) {
 i = something();
} else {
 i = somethingElse();
}

with

i = test?something():somethingElse();

You can't see it as an if-then-else shortcut, but really as a conditional expression (not conditional instruction).

When should one use the Javascript conditional operator?

2 Answers2