How ES6+ Destructuring Works

how_destructuring_works.md

How destructuring works:

Given the JS Object:

const user = { name: "Ira", email: "[email protected]", favColor: "blue" };

making variables WITHOUT using destructuring:

const name = user.name;
const email = user.email;
const favColor = user.favColor;

making THE SAME variables WITH destructuring:

const {name, email, favColor} = user;

---

You can also destructure arrays!

Given the Array:

const groceries = ["Eggs", "Milk", "Bread", "Oranges", "Strawberries"];

making variables WITHOUT using destructuring:

const grocery1 = groceries[0];
const grocery2 = groceries[1];

making THE SAME variables WITH destructuring:

const [grocery1, grocery2] = groceries;

---

Further reading:

MDN Docs