Ternary Operators in JavaScript Without an "Else"

Question

I've been using them forever, and I love them. To me they see cleaner and i can scan faster, but ever since I've been using them i've always had to put null in the else conditions that don't have anything. Is there anyway around it? E.g. condition ? x=true : null ;

basically, is there a way to do: condition ? x=true;

Now it shows up as a syntax error...

FYI, here is some real example code:

!defaults.slideshowWidth ? defaults.slideshowWidth = obj.find('img').width()+'px' : null ;

Answer 1

No, it needs three operands. That's why they're called ternary operators.

However, for what you have as your example, you can do this:

if(condition) x = true;

Although it's safer to have braces if you need to add more than one statement in the future:

if(condition) { x = true; }

Edit: Now that you mention the actual code in which your question applies to:

if(!defaults.slideshowWidth)
    { defaults.slideshowWidth = obj.find('img').width()+'px'; }

Answer 2

var x = condition || null;

Answer 3

You could write

x = condition ? true : x;

So that x is unmodified when the condition is false.

This then is equivalent to

if (condition) x = true

EDIT:

!defaults.slideshowWidth 
      ? defaults.slideshowWidth = obj.find('img').width()+'px' 
      : null 

There are a couple of alternatives - I'm not saying these are better/worse - merely alternatives

Passing in null as the third parameter works because the existing value is null. If you refactor and change the condition, then there is a danger that this is no longer true. Passing in the exising value as the 2nd choice in the ternary guards against this:

!defaults.slideshowWidth = 
      ? defaults.slideshowWidth = obj.find('img').width()+'px' 
      : defaults.slideshowwidth 

Safer, but perhaps not as nice to look at, and more typing. In practice, I'd probably write

defaults.slideshowWidth = defaults.slideshowWidth 
               || obj.find('img').width()+'px'

Answer 4

First of all, a ternary expression is not a replacement for an if/else construct - its an equivalent to an i/else construct that returns a value. That is, an if/else clause is code, a ternary expression is an expression, meaning that it returns a value.

This mean several things:

• use ternary expressions only when you have a variable on the left side of the = that is to be assigned the return value
• only use ternary expressions when the returned value is to be one of two values (or use nested expressions if that is fitting)
• each part of the expression (after ? and afer : ) should return a value without side effects (the expression x = true returns true as all expressions return the last value, but also changes x without x having any effect on the returned value)

In short - the 'correct use of a ternary expression is

var resultofexpression = conditionasboolean ? truepart: falsepart;

Instead of your example condition ? x=true : null ;, where you use a ternary expression to set the value of x, you can use this:

 condition && (x = true);

This is still an expression and might therefor not pass validation, so an even better approach would be

 void(condition && x = true);

The last one will pass validation.

But then again, if the expected value is a boolean, just use the result of the condition expression itself

var x = (condition); // var x = (foo == "bar");

UPDATE
In relation to your sample this is probably more appropriate

defaults.slideshowWidth = defaults.slideshowWidth || obj.find('img').width()+'px';