Destructuring & Spread/RestIntermediate
1Question 1 of 1
javascriptHow do destructuring and the spread/rest operators work in modern JavaScript?
Explanation & Concept
• Destructuring: Allows unpacking values from arrays or properties from objects into distinct variables with concise syntax. • Spread (`...`): Expands an iterable into individual elements (e.g. creating shallow copies of objects or merging arrays). • Rest (`...`): Collects multiple remaining elements or function arguments into a single array parameter.
Code Example
javascript
// Object destructuring with renaming and default values
const config = { host: "localhost", port: 8080 };
const { host, port, timeout = 5000 } = config;
// Rest parameters in functions
function sumAll(multiplier, ...numbers) {
return numbers.map((n) => n * multiplier);
}
console.log(sumAll(2, 10, 20, 30)); // [20, 40, 60]
// Spread operator for shallow merging
const baseUser = { id: 1, name: "Sam" };
const updatedUser = { ...baseUser, role: "admin", updatedAt: "2026-03-01" };How It Works & Key Takeaways
Spread syntax provides an elegant, non-mutating way to copy and update objects without calling `Object.assign`.
Mock Test · 1 Questions · Optional
Ready for Currying & Higher-Order Functions?
Take a quick test to evaluate yourself, or move straight to the next module.
Intermediate1 questions