What does this condition do in ternary?

Question

Javascript Ternary Condition

I have javascript with this condition, what is this?

var y = (typeof x !== undefined) ? x || 0 : 1;

Answer 1

This (typeof x !== undefined) ? x || 0 : 1; is going to return always true because the typeof operator will return a string.

That condition should compare a string as follow:

(typeof x !== 'undefined') ? x || 0 : 1;

var x;
var str = typeof x !== 'undefined' ? x || 0 : 1;

console.log(str);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Conditional (ternary) Operator explanation:

                         +--- When condition is true
                         |
                         |        +--- When condition is false
                         |        |
                         |        |
                         v        v
typeof x !== 'undefined' ? x || 0 : 1;
  ^    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  |                             |
  |                             +---- The condition should be:
  |                                   (x === undefined ? 1 : x || 0)
  |
  +--- Checks for the type of x

Code refactored

var x = 4;
var str = x === undefined ? 1 : x || 0;
console.log(str);// should return 4

var y;
str = y === undefined ? 1 : y || 0;
console.log(str);// should return 1

y = null;
str = y === undefined ? 1 : y || 0;
console.log(str);// should return 0

y = 5;
str = y === undefined ? 1 : y || 0;
console.log(str);// should return 5

y = 5-"5";
str = y === undefined ? 1 : y || 0;
console.log(str); // should return 0

.as-console-wrapper { max-height: 100% !important; top: 0; }

Docs

• Conditional (ternary) Operator
• typeof

Answer 2

First, there is an error with the condition:

(typeof x !== undefined)

because you are comparing a type against a value.

typeof always returns a string, while undefined is a value. So, whatever type x is, it will be returned as as string. Even if it's value is undefined, "undefined" (notice the quotes?) will be returned as its type and since the string "undefined" has a typeof === "string", the condition will actually branch into the true section, even when x actually is undefined.

So, it needs to be: (typeof x !== "undefined").

Or, you could test the value of x against the value undefined:

(x !== undefined)

But, you can't mix and match values and types.

---

Now, assuming we correct that, the next part (the true branch):

x || 0

Simply returns x, as long as it is not "falsy" (that is, any value that would convert to the Boolean false). 0, false, NaN, undefined, "" or null are all falsy. So, if x is not falsy, x is returned. If x is falsy, then 0 is returned. This is a way to provide a default return value in case the first value doesn't exist. But, the logic is a bit off here, because if the code has entered the true branch, it's because x is not undefined, which means it's "truthy". And, if it's truthy, then we can safely just return x. So, it really should just be:

x

Finally, the last part (the false branch)

1

Is what will be returned if the original condition is false. In this case, if x is undefined.

So, the code has flaws in it and really should be:

(typeof x  !== "undefined") ? x : 1

EXTRA CREDIT:

In reality, any expression you place into the condition of an if statement is going to be converted to a Boolean for the if to do its job. If all you need to know is if x is not a "falsy" value, then all you need to do is write:

x ? x : 1;

The x will be converted to a Boolean. If it's true (truthy), then x is returned. If it's false (falsy), then 1 is returned.

Examples:

function testX(x){
  return x ? x : 1;
}

// Truthy:
console.log(testX(10));           // 10
console.log(testX({}));           // {}
console.log(testX(true));         // true
console.log(testX("something"));  // "something"

// Falsy:
console.log(testX(""));     // 1
console.log(testX());       // 1
console.log(testX(4-"Z"));  // 1 because 4-"Z" == NaN
console.log(testX(false));  // 1
console.log(testX(0));      // 1
console.log(testX(null));   // 1

Answer 3

The condition

(typeof x !== undefined)

asks if x is not of type undefined. Or, if x is defined. This will include any value or even null.

...? x || 0

If so, the expression evaluates to this. Which is the value of x in most cases or 0 if x is anything evaluated to be boolean false, e.g., null, false, etc.

... : 1;

Otherwise (i.e. case when x is undefined), evaluates to 1.

Typing in Javascript is complicated (in my opinion), sometimes it is not easy to remember what it is when you're comparing mixed type stuff, see https://dorey.github.io/JavaScript-Equality-Table/ for a summary matrix.

Answer 4

Admitting that you have a left-hand operand, it does the same thing as :

var y;
if(typeof x !== undefined) {
    if(x)
        y = x;
    else
        y = 0;
}
else
    y = 1;