对象解构和解构赋值之间的区别？

Question

For example if I have an object like this:

let obj = { a: 1, b: 2 }
let { a, b } = obj;
console.log(a, b); // output 1, 2

But if a and b are initialized, like this:

let obj = { a: 1, b: 2 };
let a = 3, b = 4;
{ a, b } = obj;
console.log(a, b); // error

What is the difference between them, why the second output an error?

Answer 1

You need parentheses around the destructuring assignment do distinguish destructuring from a block statement where an assignment to it is not possible.

Assignment without declaration :

The round braces ( ... ) around the assignment statement is required syntax when using object literal destructuring assignment without a declaration.

{a, b} = {a: 1, b: 2} is not valid stand-alone syntax, as the {a, b} on the left-hand side is considered a block and not an object literal.

However, ({a, b} = {a: 1, b: 2}) is valid, as is var {a, b} = {a: 1, b: 2}

NOTE: Your ( ... ) expression needs to be preceded by a semicolon or it may be used to execute a function on the previous line.

 let obj = { a: 1, b: 2 }; let a = 3, b = 4; ({ a, b } = obj); console.log(a, b); // 1, 2