A cosa servono gli operatori spread e rest in JavaScript?

L'operatore spread (...) viene utilizzato per "espandere" oggetti iterabili (come array o stringhe) nei punti in cui si aspettano zero o più argomenti (quando si chiamano funzioni) o elementi (quando si creano array). Viene anche usato per combinare le proprietà degli oggetti in un nuovo oggetto.

// Uso di spread nella chiamata di una funzione
const numbers = [1, 2, 3];
console.log(...numbers); // 1 2 3

// Uso di spread per unire array
const arr1 = [1, 2];
const arr2 = [3, 4];
const combinedArr = [...arr1, ...arr2]; // [1, 2, 3, 4]

// Uso di spread per unire oggetti
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const combinedObj = { ...obj1, ...obj2 }; // { a: 1, b: 2, c: 3, d: 4 }

L'operatore rest (...) viene usato nella sintassi dei parametri di funzione per raccogliere tutti gli argomenti rimanenti in un array. Questo permette alla funzione di ricevere un numero indefinito di argomenti. Viene anche usato nella destrutturazione di array o oggetti per raccogliere gli elementi o le proprietà rimanenti.

// Uso di rest nei parametri di funzione
function sum(...args) {
  // args ora è un array [1, 2, 3]
  return args.reduce((total, current) => total + current, 0);
}
console.log(sum(1, 2, 3)); // 6

// Uso di rest nella destrutturazione di array
const [first, second, ...restOfArray] = [1, 2, 3, 4, 5];
// first = 1, second = 2, restOfArray = [3, 4, 5]

// Uso di rest nella destrutturazione di oggetti
const { a, b, ...restOfObject } = { a: 1, b: 2, c: 3, d: 4 };
// a = 1, b = 2, restOfObject = { c: 3, d: 4 }

Differenza principale:

• Spread "espande" gli elementi o le proprietà.
• Rest "raccoglie" gli elementi o le proprietà in un array/oggetto.