Check it out, we just pulled each element of that array into variables in the current scope.
Skipping assignments with Array Destructuring
You can also easily skip over assignments by putting in extra commas in destructuring assignments, it may look strange at first but I think it is cool that this exists.
Destructuring also lets you do work in conjunction with the spread operator. The spread operator is a “…” syntax that allows expressions to be expanded out where multiple elements could be expected. We’ll look at an example of what I mean.
Okay, now let’s use destructing and the spread operator to do something like an array pop or shift that does mess with the original array. This is where destructing really starts to become interesting.
And of course you can do the opposite and concatenate + compose arrays on the right hand side using the spread operator and array literal syntax. The flexibility of destructuring combined with the spread operator is refreshing.
Destructuring works on Objects as well. Object Destructing can be used to pull out variables by object key name and can be used everywhere from import statements to function parameter declarations. Let’s look at a basic example first:
Here we pulled the object keys out into variables of the same name in the current scope.
Object Destructuring in Method Params
Scratching the surface
This is just a quick look at one new feature in ES6, of which there are many more.