Alias assignment in javascript object destructuring

If you don’t know what destructuring in javascript is, check out The power of Javascript ES6 – Destructuring and Rest/Spread Operator. This feature is great to write more concise code.

Here is a simple destructuring example:

  
  
const person = { name: 'Andy' };
const { name } = person;
console.log(name);
  
  

The code above works the same as if you would do:

  
  
const person = { name: 'Andy' };
console.log(person.name);
  
  

When destructuring, you might want to rename the destructured variable. For that you will have to use the following syntax: : newName.

Example:

  
  
const person = { name: 'Andy' };
const { name: myName } = person;
console.log(myName);
  
  

While this alias syntax is useful, I try to avoid it when possible because it makes the code more confusing.

Andy

Front-end Engineer & Designer based in Dublin currently working @IBM.
I write about: Javascript, HTML, CSS, React JS, React Native and UI/UX Design.

Add comment