Destructuring in javascript

Destructuring lets you unpack values from arrays or properties from objects into separate variables in a concise way. You can set default values, skip elements, and collect the rest with the ...rest syntax.

Example

// Array destructuring
const coords = [10, 20, 30];
const [x, y] = coords;           // x=10, y=20
const [first, , third] = coords; // skip the middle element

// Object destructuring
const user = { name: "Punam", age: 25, city: "Pune" };
const { name, age } = user;
const { city = "Unknown", country = "India" } = user;

// Rest properties
const { name: n, ...rest } = user; // n = 'Punam', rest = { age:25, city:'Pune' }

Destructuring shortens code that pulls pieces out of arrays/objects and makes your intent clearer, especially when handling function parameters.

Previous Next