Bits of .NET

… Spread Operator = Power

Copying arrays is tedious. Spread operator makes it easy. Copy, merge, expand — clean code.

📝 Spread with Arrays

// Copy array
const original = [1, 2, 3];
const copy = [...original];
console.log(copy); // [1, 2, 3]

// Merge arrays
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const merged = [...arr1, ...arr2];
console.log(merged); // [1, 2, 3, 4, 5, 6]

// Add elements
const numbers = [1, 2, 3];
const extended = [0, ...numbers, 4];
console.log(extended); // [0, 1, 2, 3, 4]

// Function arguments
const args = [1, 2, 3];
Math.max(...args); // Same as Math.max(1, 2, 3)

// Convert arguments to array
function myFunction() {
    const args = [...arguments];
    return args;
}

🎯 Spread with Objects

// Copy object
const original = { name: 'Alice', age: 30 };
const copy = { ...original };
console.log(copy); // { name: 'Alice', age: 30 }

// Merge objects
const user = { name: 'Alice' };
const details = { age: 30, city: 'NYC' };
const merged = { ...user, ...details };
console.log(merged); // { name: 'Alice', age: 30, city: 'NYC' }

// Override properties
const user1 = { name: 'Alice', age: 30 };
const user2 = { ...user1, age: 31 };
console.log(user2); // { name: 'Alice', age: 31 }

// Immutable updates
const state = { count: 0 };
const newState = { ...state, count: state.count + 1 };

// Remove property (destructuring)
const { age, ...rest } = user;
console.log(rest); // { name: 'Alice', city: 'NYC' }

// Nested objects (shallow copy)
const obj = { a: 1, b: { c: 2 } };
const shallowCopy = { ...obj };
shallowCopy.b.c = 3;
console.log(obj.b.c); // 3 (shallow copy)

💡 Spread Tips

• Use for immutable updates
• Great for React state
• Shallow copy only (nested objects)
• Combine with destructuring
• Use rest operator for remaining