mirror of
https://github.com/jbranchaud/til
synced 2026-01-03 07:08:01 +00:00
Add Spread The Rest With ES6 as a javascript til
This commit is contained in:
29
javascript/spread-the-rest-with-es6.md
Normal file
29
javascript/spread-the-rest-with-es6.md
Normal file
@@ -0,0 +1,29 @@
|
||||
# Spread The Rest With ES6
|
||||
|
||||
The spread operator provided by ES6 is a powerful syntactic feature. One way
|
||||
it can be used is to capture the _rest_ of an object or array in a variable.
|
||||
|
||||
```javascript
|
||||
const pokemon = ["Charmander", "Squirtle", "Bulbasaur"];
|
||||
const [first, ...rest] = pokemon;
|
||||
|
||||
console.log("Remaining: ", rest); // Remaining: ["Squirtle", "Bulbasaur"]
|
||||
|
||||
const gymLeaders = {
|
||||
brock: "rock",
|
||||
misty: "water",
|
||||
surge: "electric",
|
||||
erika: "rainbow"
|
||||
};
|
||||
let { brock, erika, ...otherLeaders } = gymLeaders;
|
||||
|
||||
console.log(otherLeaders); // Object {misty: "water", surge: "electric"}
|
||||
```
|
||||
|
||||
Using this spread destructuring we can capture the remaining parts of an
|
||||
array or object in a variable. We can also use this syntax in a function
|
||||
signature to grab specific items from an incoming object argument without
|
||||
losing track of the rest -- this is especially useful in React.js
|
||||
development when dealing with incoming props.
|
||||
|
||||
See a [live example here](https://codesandbox.io/s/ov2xr1o12y).
|
||||
Reference in New Issue
Block a user