What is object destructuring?

28 April, 2025

Object destructuring is an assignment of an object properties to a newly created variables.

More intuitive example which works in a similar way is object literal with property assignments:

const name = 'name';
const surname = 'surname';
const obj = { name, surname };

We assign name and surname variables to a newly created obj.name and obj.surname properties. It means that when we use the obj.name variable - it points to the same value as name which is 'name' string.

Destructuring does the same but syntax goes in the opposite direction:

const { name, surname } = obj;

We assign obj.name and obj.surname properties to a newly created const variables name and surname. It means that when we use the name variable - it points to the same value as obj.name which is 'name' string.