What is better in ES6 'Destructuring Assignment' vs old way?

JavaScript
1

Hi all.
I have a question to this lesson.
Why should I ever use ‘Destructuring Assignment’?

const {tomorrow:{max:maxOfTomorrow}} = forecast;

The old way is shorter and more beautiful.

const maxOfTomorrow = forecast.tomorrow.max;

So why or when :thinking:?

2

AirBnb JS guide explains it the best:
Use object destructuring when accessing and using multiple properties of an object. eslint: prefer-destructuring jscs: requireObjectDestructuring

Why? Destructuring saves you from creating temporary references for those properties.

3

The key phrase here is multiple, so

const obj = {
  name: 'Bob',
  age: 37,
  marriedTo: 'Alice'
};

const { name, age, marriedTo } = obj;
// Now, this is shorter and more beautiful ;)
1 Like
4

1- Multiple variable creation as explained above.
2- Can destructure in: function parameters and assignment statements.
3- Object can be aliased and so can the captured values.
4- Also works with arrays.
5- Mixed destructuring.
6- Reads beautifully and modern languages have this feature.

1 Like
5

Thanks for answer. Now it is clear to me :smiley: