JavaScript destructuring, spread, and rest
Destructuring pulls values out of arrays and objects into variables in one statement. For objects, the names in braces select properties, a colon renames or goes deeper into a nested object, and = gives a default for a missing value. For arrays, the position decides which element is taken, and a gap skips one.
JavaScript
const user = { name: "Ada", age: 36, address: { city: "London" } };
const { name, address: { city }, role = "guest" } = user;
console.log(name, city, role);
const updated = { ...user, age: 37 };
console.log(user.age, updated.age, updated.address === user.address);
const [first, , third, ...rest] = [1, 2, 3, 4, 5];
console.log(first, third, rest.join(","));
function total(label, ...numbers) {
return label + ": " + numbers.reduce((sum, n) => sum + n, 0);
}
console.log(total("sum", 1, 2, 3, 4));
const merged = [...[1, 2], ...[3, 4]];
console.log(merged.join(","));