4

Say we have nested ternary statements:

return foo ? 1 : bar ? 2 : 3;

What is the best way to format this code to ensure future readability by others.

3
  • 2
    Don't do that. Nested ternary statements seriously hurt readability.
    – Quentin
    Feb 21, 2016 at 20:36
  • 1
    Please read this codereview post. Feb 21, 2016 at 20:52
  • This looks to be opinion based without a "correct" answer, or best decision made on a case by case basis (my opinion). @ariberiro supplied link to codereview discusses the topic further.
    – traktor
    Feb 22, 2016 at 1:34

6 Answers 6

12

This post is the most popular opinion I could find on this. The suggestion there is

return foo ? 1 :
       bar ? 2 : 
             3 ;
0
return foo ? 1 : (bar ? 2 : 3) ;
0
0

To separate function

function getValue(cond1, cond2) {
  if(cond1) return 'a';
  if(cond2) return 'b';
  return 'c';
}

function work() {
  const result = getValue(/* some params */);
}
0

I have a preference for the readability of this style of ternary operator formatting:

return foo
    ? bar
    : baz
      ? qux
      : qiz
        ? 1
        : 2;
-1

I can't tell if this is accepted or not but i use it this way all the time.

Ternary gives you such a natural testing structure that you can make the code very readable just by making it multiline and indenting properly. I strongly believe that the following usage of ternary is the best manifestation of a nested conditional.

return foo ? 1 
           : bar ? 2
                 : 3;

In more complicated cases you can make ternary and comma operator work together beautifully. Keep in mind that the last instruction in a comma separated group gets returned automatically. Super handy for ternary.

return foo ? ( doSometingFoo()
             , variable++
             , collectResult()               // and return foo result
             )
           : bar ? ( doSomethingBar()
                   , variable--
                   , collectAnotherResult()  // and return bar result
                   )
                 : ( doSomethingReject()
                   , variable = 0
                   , rejectSomehow()         // and return error code
                   )
1
  • 1
    This kind of works for like three levels but quickly breaks down when you have more than three legs due to excessive indenting. Lining it up like this answer is better for handling an arbitrary number of legs: stackoverflow.com/a/44724098 Jul 13, 2021 at 7:49
-3

For readability just stay away from those statements, they're very easy to misread, if you want something more readable just expand and use normal statments..

Nothing wrong with just having a nested if statement list..

if(foo){
   return 1
}else{
  if(bar){
      return 2;
  }else{
      return 3;
  }
}
1
  • Usage of multiple if's instead of ternary operators is contraindicated by some languages due to performance concerns (e.g. QML)
    – senx
    Nov 7, 2022 at 18:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.