2

I have this code example:

var a = 10;
({a}) = 0;

In Google Chrome, it shows an error: SyntaxError: Invalid destructuring assignment target

In Firefox, it shows an error: ReferenceError: invalid assignment left-hand side

Actually, I would like to understand what kind of error it is?

MaximPro
  • 563
  • 8
  • 21
  • What did you expect that code to do? – Pointy Mar 02 '19 at 20:49
  • @Pointy just testing the language – MaximPro Mar 02 '19 at 20:50
  • 2
    Well the language is telling you that that's wrong :) The `( )` are wrong, and the right-hand side is not an object so that's wrong too. – Pointy Mar 02 '19 at 20:52
  • Because you're using an incorrect syntax: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment – Terry Mar 02 '19 at 20:54
  • It's still interesting that both browsers throw different errors. – Jonas Wilms Mar 02 '19 at 20:56
  • @Terry If I need, I will write the correct code. Just re-read my main question. – MaximPro Mar 02 '19 at 20:58
  • It turns out I was wrong; it is in fact possible to destructure into already existing variables. All you have to do is: `({ a } = { a: 42 })`. Note that the parentheses have to go around the entire assignment expression, not just the LHS. – Asad Saeeduddin Mar 02 '19 at 20:59
  • @Terry ok write the next code: `var a = 10; ({a} = 0;)` There will be no error – MaximPro Mar 02 '19 at 21:01
  • Which was precisely the syntax suggested in the MDN article I linked...? – Terry Mar 02 '19 at 21:02
  • @MaximPro This results in a `SyntaxError`, at least in Firefox. The grammar doesn't allow for destructuring assignments where new variables aren't being declared without wrapping the whole assignment expression in parentheses. (re: the unedited version of your comment, `var a = 10; {a} = 0;`) – Asad Saeeduddin Mar 02 '19 at 21:03

1 Answers1

4

Well, it's simply invalid syntax. You are not allowed to put a destructuring pattern in parentheses[1]:

It is an early Reference Error[2] if LeftHandSideExpression is neither an ObjectLiteral nor an ArrayLiteral and IsValidSimpleAssignmentTarget of LeftHandSideExpression is false.

The ({a}) you have as a LeftHandSideExpression is a ParenthesizedExpression, not an ObjectLiteral, and the parenthesis don't contain a simple assignment target.

You probably are looking for a parenthesised statement to allow the destructuring pattern:

var a = 10;
({a} = 0);

1: Surprisingly, (a) = 0; is a valid statement though.
2: It seems that Chrome is wrong by throwing a SyntaxError then

Bergi
  • 630,263
  • 148
  • 957
  • 1,375
  • Hmm, if this is a syntax error, then where to look for its error in ecmascript? – MaximPro Mar 02 '19 at 21:05
  • I mean, If is it SyntaxError then it is early error. Where I can find? – MaximPro Mar 02 '19 at 21:09
  • `It is a Syntax Error if LeftHandSideExpression is neither an ObjectLiteral nor an ArrayLiteral and IsValidSimpleAssignmentTarget(LeftHandSideExpression) is false.` on page 281. – Jonas Wilms Mar 02 '19 at 21:10
  • @JonasWilms I understand correctly that this part of the code `({a})` from `({a}) = 0` is perceived as AssignmentPattern – MaximPro Mar 02 '19 at 21:16
  • @MaximPro No, parentheses are not permitted in the productions of *AssignmentPattern* – Bergi Mar 02 '19 at 21:30