Destructuring, Rest, and Spread | JavaScript Lesson

Lesson content

Read, practise, then check your understanding

Destructuring extracts array positions or object properties. Defaults run only for undefined. Rest collects remaining values; spread expands iterables or own enumerable properties.

Clear data movement

const user = { id: 7, name: "Mira", role: "editor" };
const { id, name, role = "viewer", ...metadata } = user;

const first = [1, 2, 3];
const combined = [...first, 4, 5];

Object spread is shallow and later properties overwrite earlier ones. It does not copy the prototype or faithfully clone descriptors. Rename bindings with { name: displayName }; swap values with array destructuring. Avoid overly deep patterns that hide validation or make missing data hard to diagnose.

Knowledge check

Answer every question correctly to complete this chapter.

Which statement best describes destructuring?

Which JavaScript term matches this description: Binding values selected from arrays or objects by pattern.

Which statement best describes spread syntax?

Which JavaScript term matches this description: Expansion of iterable values or own enumerable object properties.

Which statement best describes rest property?

Which JavaScript term matches this description: Collection of remaining properties into a new object.

Which statement best describes default initializer?

Which JavaScript term matches this description: A fallback used when a destructured value is undefined.

Which statement best describes computed property?

Which JavaScript term matches this description: An object property name evaluated from an expression.

0 of 10 checks passed

Your progress is saved on this device.