Which Logic Operator Takes Precedence

JavascriptIf StatementLogicOperator Precedence

Javascript Problem Overview


So, I'm looking into writing a slightly more complex operation with logic operators in an if-else statement. I know I can do parentheses, and I know it's the better way of doing this, but I've gotten curious and so I'm going to ask. If I were to do something like this:

if (firstRun == true || selectedCategory != undefined && selectedState != undefined) {
//Do something
} else {
//Do something else
}

How will that be operated without the use of parentheses? I know there is an order of operations for logic operators, similar to PEMDAS, right? I'm curious if it'll be ran something like this:

firstRun == true || (selectedCategory != undefined && selectedState != undefined)

or maybe if the 'OR' operator takes precedence instead and it ends up going like:

(firstRun == true || selectedCategory != undefined) && selectedState != undefined

The full list would be nice, if you can find it somewhere, of the order of operations for this. Thanks!

Javascript Solutions


Solution 1 - Javascript

My rule of thumb, which covers basically 99% of all use cases for conditional statements, is:

  1. Grouping: ()
  2. Member access . or [...]
  3. Not: !
  4. Comparison, e.g. < , >= , === , !=, ...
  5. Logical AND &&
  6. Logical OR ||

MDN gives you the exhaustive breakdown: Javascript Operator Precedence

so for your example:

(firstRun == true || selectedCategory != undefined && selectedState != undefined)

equals

(firstRun == true) || ((selectedCategory != undefined) && (selectedState != undefined))

For anything more complex than the above mentioned cases I would look into refactoring the code for readabilities sake anyways!

Solution 2 - Javascript

There is a pretty good rule of thumb to this. Think of these operators as of mathematical ones:

  • AND is multiplication (eg. 0 * 1 = 0 => FALSE)
  • OR is adding (eg. 0 + 1 = 1 => TRUE)

When you remember this, all you have to know is that multiplication always comes before addition.

Solution 3 - Javascript

See this chart for precedence.

I'm not going to explain what happens because the next guy reading your code will think: "WTF? Does that do what it should?"

So the better solution is to wrap the terms in parentheses even if you know the precedence, applied it correctly and the code works

This follows the old wisdom that you shouldn't do everything you can just because you can do it. Always keep an eye on the consequences.

Solution 4 - Javascript

https://developer.mozilla.org/en/JavaScript/Reference/Operators/Operator_Precedence

&& is before ||, so your expression is equivalent to:

firstRun == true || (selectedCategory != undefined && selectedState != undefined)

Solution 5 - Javascript

It will be the first:

firstRun == true || (selectedCategory != undefined && selectedState != undefined)

As a general rule in most programming languages AND has higher precedence

Solution 6 - Javascript

While Logical Operator Precedence is not actually defined in the ECMAScript Specification, MDN does a pretty good job of it and even has a separate page for Logical Operators.

My concern I suppose, since Logical Operator Precedence is not actually defined in the ECMAScript Specification, each individual browser vendor can potentially be different (I'm talking to you, Internet Explorer!) so YMMV.

In the event anyone wants to test this across different browsers, here's a test case fiddle: http://jsfiddle.net/HdzXq/

Solution 7 - Javascript

I know this is an old post, but I was wondering if the order should be reversed. I've always thought that the more demanding half of an or statement should be listed first, because it's less likely to pass:

The correct response from Cristoph:

(firstRun == true) || ((selectedCategory != undefined) && (selectedState != undefined))

Should it actually be written as?:

((selectedCategory != undefined) && (selectedState != undefined) || firstRun == true))

I feel like there's a good chance that you would never even get to the second half in the first example.

Let me know what you think.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJTAppsView Question on Stackoverflow
Solution 1 - JavascriptChristophView Answer on Stackoverflow
Solution 2 - JavascriptMichal LeszczykView Answer on Stackoverflow
Solution 3 - JavascriptAaron DigullaView Answer on Stackoverflow
Solution 4 - JavascriptBlindyView Answer on Stackoverflow
Solution 5 - JavascriptMariyView Answer on Stackoverflow
Solution 6 - JavascriptpeteView Answer on Stackoverflow
Solution 7 - JavascriptMitchellView Answer on Stackoverflow