The Road to React: The One with Class Components/

...

/

ES6 Destructuring

ES6 Destructuring

A brief introduction to destructuring and things we can access through it.

We'll cover the following...

Destructuring in JavaScript ES6 provides easier access to properties in objects and arrays. Compare the following snippet in JavaScript ES5 and ES6:

Press + to interact
// comment either ES5 or ES6 code
const user = {
  firstname: 'Robin',
  lastname: 'Wieruch',
};
// ES5
// var firstname = user.firstname;
// var lastname = user.lastname;
// ES6
var { firstname, lastname } = user;
console.log(firstname + ' ' + lastname);

While we add an extra line each time we access an object property in JavaScript ES5, it takes just one ...