So, a junior programmer on my team today wrote the following piece of code:

if(status === ("incomplete" || "unknown"))

Which is obviously not going to do what he intended, which was this:

if(status === "incomplete" || status === "unknown"))

But what I can't explain is why exactly the first snippet of code wouldn't work! Or why it evaluates to true if 'status' is set to 'incomplete' but to false when it's set to 'unknown'...

So, a junior programmer on my team today wrote the following piece of code:

if(status === ("incomplete" || "unknown"))

Which is obviously not going to do what he intended, which was this:

if(status === "incomplete" || status === "unknown"))

But what I can't explain is why exactly the first snippet of code wouldn't work! Or why it evaluates to true if 'status' is set to 'incomplete' but to false when it's set to 'unknown'...

• javascript

3 Answers 3

In JavaScript, the || operator returns its first operand if it evaluates to true (i.e. it is not false, null, undefined, "", or 0), and its second operand otherwise.

In the first case, ("incomplete" || "unknown") always evaluates to "incomplete", since it evaluates to true.

The entire condition then becomes:

if (status === "incomplete")

Which explains the behaviour you are observing.

("incomplete" || "unknown") will return "incomplete" which is than compared to status.

But what I can't explain is why exactly status === ("incomplete" || "unknown") wouldn't work

That's because the expression in the parenthesis is evaluated first. The non-empty string incomplete is truthy, so the OR-expression ("incomplete" || "unknown") yields "incomplete" and only that is then compared with your status variable.

To shorten the condition, there are many ways including arrays of values, regular expression test etc.