1

I need to know whether operator Associativity is the same as the order of evaluation of assignment operator and other operators in JavaScript for example

var x; 
x = 10;

In the above code I need to know whether the Assignment expression x = 10; is executed from "right to left" or "left to right" because the operator Associativity of the Assignment operator is "right to left" im a little bit worried about how a normal assignment expression like this x = 10; is executed. Is it executed from "right to left" or "left to right" where as in the below code you can see the assignment expression is executed from right to left. 

var y;
var z;
y = z = 10; // In this snippet you can see that both the variables "y" and "z" hold the value of number 10 this means that the Assignment operator is executed from "right to left"; 



// Now i must know whether a normal Assignment operator is also executed from "right to left" because Assignment operator is having "right to left" Associativity;

var c;
c = 10; // Not sure whether how and to which side this assignment expression is executed is it executed from "left to right" or "right to left"
txemsukr
  • 1,017
  • 1
  • 10
  • 32
Kevin
  • 209
  • 2
  • 11
  • 1
    If "left to right" assignment in JS worked then `10 = x` should work flawlessly. – Alex Michailidis Mar 04 '20 at 14:37
  • 1
    the assignment operator in JavaScript is right-associative regardless of how many operations you include in your expression: `a = b = 10;` and `a = 10;` are both right-associative. You can take a look at the op table and each operators associativity on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table – Hunter McMillen Mar 04 '20 at 14:37
  • @HunterMcMillen hello there so you mean that a normal assignment expression is also executed from "right to left " – Kevin Mar 04 '20 at 14:40
  • @AlexMichailidis i think the Assignment expression is executed from "left to right" in ur case because first it will have to check the left operand which is usually a variable but in ur case its a number. number "10" so because the assignment operator is executed from left to right only your code gave an error – Kevin Mar 04 '20 at 14:43
  • 1
    Right side of the equal sign gets assigned to the left side. Stop overthinking it – bryan60 Mar 04 '20 at 15:12

1 Answers1

2

The answer can be found in MDN's page on Operator Precedence (emphasis mine):

Associativity determines how operators of the same precedence are parsed. For example, consider an expression:

a OP b OP c

Left-associativity (left-to-right) means that it is processed as (a OP b) OP c, while right-associativity (right-to-left) means it is interpreted as a OP (b OP c).

Associativity only comes into play if you have multiple operators of the same precedence. In the case that you have multiple assignment operators, they are evaluated from right to left - but each individual assignment operator is still assigning the right operand to the left name.

In your code snippet:

y = z = 10;

This is equivalent to:

y = (z = 10);

And since an assignment operator evaluates to the value that was assigned (10) you get y = 10; after z is assigned.

If you only have one operator, associativity does not apply. In an assignment operator, the right operand is assigned to the left operand, full stop. The order they're evaluated is determined by operator precedence as laid out in the MDN page above.

Klaycon
  • 10,599
  • 18
  • 35
  • 1
    Also, to reinforce what Klaycon just said: `a = 1 + 3 * 4 * 4` will still execute the multiply `*` operations first (either left-to-right or right-to-left where they're adjacent), since this operator has higher *precedence* than `+`. This conforms to the ordinary rules of algebra. The result will be `49`. – Mike Robinson Mar 04 '20 at 15:21
  • @Klaycon well if `x = y = 10;` is executed from right to left can i know how this is executed `x = 10;` is `x = 10;` executed from right to left like the `x = y = 10;` ? – Kevin Mar 04 '20 at 15:57
  • 1
    @Kevin "executed from right to left" is ambiguous. The assignment operator `=` evaluates the right operand first, and then assigns its value to the left operand. `x = 10` evaluates `10` first, then assigns it to `x`. `x = y = 10;` is parsed into `x = (y = 10)` first due to operator associativity, then `y = 10` gets evaluated first, then `x` is assigned to the result of the `y = 10` evaluation. – Klaycon Mar 04 '20 at 16:01
  • @Klaycon well how do you prove that an assignment operator is executed from right to left – Kevin Mar 05 '20 at 12:50
  • @Kevin can you please give more details on why this is a question you have or why you need to prove it? are you having some issue related to order of execution? it seems like you might be having an XY problem, that is, some other problem being misdiagnosed as an order of execution issue – Klaycon Mar 05 '20 at 15:07
  • @Klaycon yes i wanna know the exact thing which happens behind the scenes N i think that the Assignment operator is executed from "left to right" if you read about the assignment operator in the javaScript specification you will get what i mean and every program is executed from "top to bottom" but i dunno why everyone keeps telling me that the assignment operator is executed from "right to left" if you know why the assignment operator is executed from "right to left" pls tell me the reasons behind the scenes – Kevin Mar 10 '20 at 06:20
  • @Kevin behind the scenes, there are only two things being considered: operator precedence and, if needed, operator associativity. by the rules of operator precedence, because the assignment operators have a *very low* precedence of 3, almost all other operators are considered before it. this means in any complex expression such as `y = z * 10 + someStuff++ || await getStuff()`, **all** of the stuff on the right is evaluated first, and the total result is then assigned to `y`. In the case of multiple assignment operators, they are evaluated right to left due to operator associativity. – Klaycon Mar 10 '20 at 13:34
  • @Kevin you can prove this yourself by trying different combinations of operators in a console to see that they behave exactly consistently with MDN's operator precedence page. If you find an example that confuses you, I strongly recommend asking a more focused question on that example so that the nuances can be explained in the right context. – Klaycon Mar 10 '20 at 13:36
  • @Klaycon `y = z * 10 + someStuff++ || await getStuff()` so now you mean the variable name `'y'` in you case is not evaluated before the other stuff after the = 'assignment' operator is evaluated – Kevin Mar 11 '20 at 12:19
  • @Kevin yes, the assignment does not happen until all of the RHS is evaluated – Klaycon Mar 11 '20 at 12:43
  • then what about this `x = 3;` x * 2 + (x = 5); in here as you can see though i have given a higher precedence to the assignment operator `x = 5` first the multiplication is happened `x * 2` and then later only the assignment of the variable x happened this is why after running the above expression it returned `11` if the assignment is happened first then the reslu must be `15` – Kevin Mar 11 '20 at 12:53
  • @Kevin when the interpreter reads `x * 2 + (x = 5)`, it first reaches `x * 2`. Then as it reaches `+`, by the rules of operator precedence, `x * 2` (which has a higher precedence) becomes an *operand* of the `+` (which has a lower precedence). So now you have, effectively, `(x * 2) + (x = 5)`. The group `(x = 5)` also becomes an operand of `+` for the same reason. Then the addition operator is evaluated: the left hand side is evaluated, then the right hand side is evaluated, then the results of both are added and returned. So you get `(x * 2) = 6`, then `(x = 5) = 5`, and `6 + 5 = 11`. – Klaycon Mar 11 '20 at 13:40
  • @Kevin Remember that this is **not** associativity, nor is it a question of assignment operators evaluating right to left. Precedence does *not* mean the highest precedence clauses are evaluated first, it means the highest precedence phrases become operands of the lowest precedence operators. Expressions are still only evaluated when the interpreter needs them. – Klaycon Mar 11 '20 at 13:43
  • @Klaycon okay so if you read the ecmascript specification you can see that the variable name is first evaluated before the right operand of the assignment operator and in the above example you can see that `x = 3; x * 2 + (x = 5)` the `x * 2` is first evaluated before the assignment operation though we have given it higher precedence using parenthesis – Kevin Mar 12 '20 at 07:13
  • @Kevin again, precedence does not determine order of evaluation. Parentheses aren't evaluated first. Assignment operators aren't evaluated first. Associativiry doesn't matter here. If you were to write a function call: `doStuff(x * 2, (x = 5))` the x * 2 is evaluated first because it comes first. The same is true for `x * 2 + (x = 5)`. The interpreter doesn't search an entire statement and skip ahead of all previous expressions to evaluate expressions in parentheses first, that would be very difficult to work around. – Klaycon Mar 12 '20 at 13:40
  • @Kevin Precedence determines exactly one thing: which operators **become operands** of which other operators. In the case of `x * 2 + (x = 5)` it tells the interpreter exactly one thing: the parenthesized group and the * operator both **become operands** of +. It doesn't say parentheses are evaluated first, it says parentheses become operands of every other operator. So all it does is tell the interpreter to group the operators like this: `(x * 2) + (x = 5)` and then the expression is evaluated like all other code, left to right. – Klaycon Mar 12 '20 at 13:43
  • @Klaycon then why the same rule is not applied to the assignment operator in javaScript i mean `x = 7` why do you say that `number 7` is first evaluated before the identifier `x` – Kevin Mar 15 '20 at 12:27