How to write a ternary operator (aka if) expression without repeating yourself How to write a ternary operator (aka if) expression without repeating yourself javascript javascript

How to write a ternary operator (aka if) expression without repeating yourself


Personally I find the best way to do this is still the good old if statement:

var value = someArray.indexOf(3);if (value === -1) {  value = 0;}


Code should be readable, so being succinct should not mean being terse whatever the cost - for that you should repost to https://codegolf.stackexchange.com/ - so instead I would recommend using a second local variable named index to maximize reading comprehensibility (with minimal runtime cost too, I note):

var index = someArray.indexOf( 3 );var value = index == -1 ? 0 : index;

But if you really want to cut this expression down, because you're a cruel sadist to your coworkers or project collaborators, then here are 4 approaches you could use:

1: Temporary variable in a var statement

You can use the var statement's ability to define (and assign) a second temporary variable index when separated with commas:

var index = someArray.indexOf(3), value = index !== -1 ? index: 0;

2: Self-executing anonymous function

Another option is an self-executing anonymous function:

// Traditional syntax:var value = function( x ) { return x !== -1 ? x : 0 }( someArray.indexOf(3) );// ES6 syntax:var value = ( x => x !== -1 ? x : 0 )( someArray.indexOf(3) );

3: Comma operator

There is also the infamous "comma operator" which JavaScript supports, which is also present in C and C++.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comma_Operator

You can use the comma operator when you want to include multiple expressions in a location that requires a single expression.

You can use it to introduce side-effects, in this case by reassigning to value:

var value = ( value = someArray.indexOf(3), value !== -1 ? value : 0 );

This works because var value is interpreted first (as it's a statement), and then the left-most, inner-most value assignment, and then the right-hand of the comma operator, and then the ternary operator - all legal JavaScript.

4: Re-assign in a subexpression

Commentator @IllusiveBrian pointed out that the use of the comma-operator (in the previous example) is unneeded if the assignment to value is used as a parenthesized subexpression:

var value = ( ( value = someArray.indexOf(3) ) !== -1 ? value : 0 );

Note that the use of negatives in logical expressions can be harder for humans to follow - so all of the above examples can be simplified for reading by changing idx !== -1 ? x : y to idx == -1 ? y : x:

var value = ( ( value = someArray.indexOf(3) ) == -1 ? 0 : value );


For numbers

You can use the Math.max() function.

var value = Math.max( someArray.indexOf('y'), 0 );

It will keep the boundaries of the result from 0 until the first result greater than 0 if that's the case. And if the result from indexOf is -1 it will return 0 as is greater than -1.

For booleans and boolean-y values

For JS there is no general rule AFAIK specially because how falsy values are evaluated.

But if something can help you most of the time is the or operator (||):

// Instead ofvar variable = this_one === true ? this_one : or_this_one;// you can usevar variable = this_one || or_this_one;

You have to be very careful with this, because in your first example, indexOf can return 0 and if you evaluate 0 || -1 it will return -1 because 0 is a falsy value.