Do czego służą operatory spread i rest w JavaScript?

Operator spread (...) jest używany do "rozszerzania" obiektów iterowalnych (takich jak tablice lub łańcuchy znaków) w miejscach, gdzie oczekuje się zero lub więcej argumentów (przy wywołaniu funkcji) lub elementów (przy tworzeniu tablic). Jest również stosowany do łączenia właściwości obiektów w nowy obiekt.

// Użycie spread w wywołaniu funkcji
const numbers = [1, 2, 3];
console.log(...numbers); // 1 2 3

// Użycie spread do łączenia tablic
const arr1 = [1, 2];
const arr2 = [3, 4];
const combinedArr = [...arr1, ...arr2]; // [1, 2, 3, 4]

// Użycie spread do łączenia obiektów
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const combinedObj = { ...obj1, ...obj2 }; // { a: 1, b: 2, c: 3, d: 4 }

Operator rest (...) jest używany w składni parametrów funkcji do zbierania wszystkich pozostałych argumentów w tablicę. Pozwala to funkcji na przyjęcie nieokreślonej liczby argumentów. Jest również stosowany w destrukturyzacji tablic lub obiektów do zbierania pozostałych elementów lub właściwości.

// Użycie rest w parametrach funkcji
function sum(...args) {
  // args jest teraz tablicą [1, 2, 3]
  return args.reduce((total, current) => total + current, 0);
}
console.log(sum(1, 2, 3)); // 6

// Użycie rest w destrukturyzacji tablic
const [first, second, ...restOfArray] = [1, 2, 3, 4, 5];
// first = 1, second = 2, restOfArray = [3, 4, 5]

// Użycie rest w destrukturyzacji obiektów
const { a, b, ...restOfObject } = { a: 1, b: 2, c: 3, d: 4 };
// a = 1, b = 2, restOfObject = { c: 3, d: 4 }

Główna różnica:

• spread "rozszerza" elementy lub właściwości.
• rest "zbiera" elementy lub właściwości w tablicę/obiekt.