Destructing assignment to swap the values in ES6

Question

I am revising JavaScript and came to following ES6 example.

let a = 8, b = 6;
// change code below this line
[a,b] = [b,a];
// change code above this line
console.log(a); // a is 6
console.log(b); // b is 8

Not able to figure out how this is working, as we have assignment operator with both side arrays.

From the title and the tags, you seem to already know that it's a [destructuring assignment](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment). What further information do you need? — Robby Cornelissen, Feb 04 '20 at 03:54
@RobbyCornelissen Learning destructuring assignment and not able to figure out how this working as it seems different than = operator behavior right-to-left — Amol Patil, Feb 04 '20 at 03:56
No, there's no change in behavior for the assignment operator. Values are still assigned from right to left. — Robby Cornelissen, Feb 04 '20 at 03:59

score 1 · Accepted Answer · answered Feb 04 '20 at 04:00

1

Destructuring basically separates an array or an object into separate variables. That is what happens on the left side. Exemple:

var foo = [1, 2]
var [a, b] = foo; // creates new variables a and b with values from the array foo

console.log(a); // prints "1"
console.log(b); // prints "2"

On the right side, you are creating an array with the values [b, a] which will be destructured. As a result, the two variables are switched.

answered Feb 04 '20 at 04:00

Luke

565
5
19

Thanks, I get confused with statement [a,b] = [b,a]. – Amol Patil Feb 04 '20 at 04:02

Destructing assignment to swap the values in ES6

1 Answers1