За какво се използват операторите spread и rest в JavaScript?

Операторът spread (...) се използва за "разширяване" на итерабелни обекти (като масиви или низове) на места, където се очакват нула или повече аргументи (при извикване на функции) или елементи (при създаване на масиви). Той също така се използва за обединяване на свойства на обекти в нов обект.

// Използване на spread при извикване на функция
const numbers = [1, 2, 3];
console.log(...numbers); // 1 2 3

// Използване на spread за обединяване на масиви
const arr1 = [1, 2];
const arr2 = [3, 4];
const combinedArr = [...arr1, ...arr2]; // [1, 2, 3, 4]

// Използване на spread за обединяване на обекти
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const combinedObj = { ...obj1, ...obj2 }; // { a: 1, b: 2, c: 3, d: 4 }

Операторът rest (...) се използва в синтаксиса на параметрите на функция за събиране на всички останали аргументи в масив. Това позволява на функцията да получава неопределен брой аргументи. Той също така се използва при деструктуриране на масиви или обекти за събиране на останалите елементи или свойства.

// Използване на rest в параметри на функция
function sum(...args) {
  // args сега е масив [1, 2, 3]
  return args.reduce((total, current) => total + current, 0);
}
console.log(sum(1, 2, 3)); // 6

// Използване на rest при деструктуриране на масив
const [first, second, ...restOfArray] = [1, 2, 3, 4, 5];
// first = 1, second = 2, restOfArray = [3, 4, 5]

// Използване на rest при деструктуриране на обект
const { a, b, ...restOfObject } = { a: 1, b: 2, c: 3, d: 4 };
// a = 1, b = 2, restOfObject = { c: 3, d: 4 }

Основната разлика:

• spread "разширява" елементите или свойствата.
• rest "събира" елементите или свойствата в масив/обект.