CODEWITHSUNDEEP
javascriptoperator-precedence
Kevin
Kevin

Reputation: 219

Why does the function call take place after the increment of variable x in this JavaScript code

Why is the function call not executed first? According to JavaScript operator precedence function call is having precedence 19 but as you see in the below code the function call is executed after the increment of the variable x. That means the function call outputs the incremented value of the variable x which is 1.

 var x; // variable x;
 x = 0; // assigned the value 0 to variable x;
 ++ x + alert(x); // function call outputs the value 1;

As you saw in the above code the function call did not get executed first. If the function call is executed first then it must show an alert box with the number 0 but the alert box showed the number 1 on it. This means that after the increment of variable x only the function call is executed.

Upvotes: 0

Views: 233

Answers (4)

Klaycon
Klaycon

Reputation: 11080

Precedence determines how an expression is parsed, not necessarily how the order it is evaluated. From MDN:

Operators with higher precedence become the operands of operators with lower precedence.

This means, when parsing the expression, you can think of it more like the lowest precedence operators are "considered" first - and then each operand of that lowest precedence operator is evaluated. You may also consider it like, the lowest precedence operators "separate" the expression before the higher precedence operators. They define a point at which one piece's results do not affect another piece's.

So when parsing your expression, you first consider the lowest precedence operator, and separate the expression into two implicit expressions:

(++ x) + (alert(x));

Operands are evaluated left to right always, so since the operators of the two sides don't actually interact (in a way that can be parsed), these pieces are evaluated in this order:

++x //x = 1
alert(x) //alert(1)
1 + undefined // results of the above two, added together

Function calls having a higher precedence doesn't mean they get absolutely executed first, it just means that they serve as a singular "unit" that won't get separated by most other operators.

Upvotes: 2

JLRishe
JLRishe

Reputation: 101662

When you break it down, at the root of your expression, you have a + operator. The way + works is that first its LHS is evaluated to a value, then its RHS is evaluated to a value, and then they are added together.

The LHS is:

++ x

So that will be evaluated first.

Then the RHS is evaluated:

alert(x)

And then they are added together.

You can think of operator precedence as a tiebreaker between two operators fighting over the same operand.

From MDN:

Operator precedence determines how operators are parsed concerning each other. Operators with higher precedence become the operands of operators with lower precedence.

So if you had this expression:

++f(2)

The question is, do we interpret this as:

(++f)(2)

Or as:

++(f(2))

Since function call has higher precedence than ++, the answer is the second one.

Upvotes: 1

infinitezero
infinitezero

Reputation: 2077

Code is interpreted from left to right and then according to precedence.

 >++       (Precedence 19)
 >x        (symbol)
 >+        (Precedence 14)
 >alert(x) (Precedence 20)

Now going from up to down (same as left to right) we notice that ++ has a higher precedence than + so we execute ++ first. Following downwards, + is slower than the function call, so we execute the function call first.

Look at this other example

++get_a_number()

Here the function call has higher precedence than the increment, so it will be evaluated before.

Upvotes: 1

Ruan Mendes
Ruan Mendes

Reputation: 92274

You are misunderstanding precedence. The higher precedence of the function call parentheses means that it will behave as 

++ x + (alert(x))

Instead of 

(++ x + alert)(x)

Upvotes: 3

Related Questions