Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How ES6+ Destructuring Works

How destructuring works:

Given the JS Object:

const user = { name: "Ira", email: "ira@example.com", 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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment