Rest и Spread Оператори

В JavaScript ES6 въведоха два нови оператора - Rest и Spread, които могат да бъдат използвани за манипулация на масиви, обекти и функции.

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

Rest оператор

Например, ако искаме да съберем произволен брой числа, можем да напишем функция, която използва Rest оператора, за да събере всички аргументи в масив:

function sum(...numbers) {
  let total = 0;
  for (let num of numbers) {
    total += num;
  }
  return total;
}

console.log(sum(1, 2, 3)); // 6
console.log(sum(4, 5, 6, 7)); // 22

Пример с Rest оператор в функция за средно аритметично на произволен брой числа:

function average(...nums) {
  let sum = 0;
  for (let num of nums) {
    sum += num;
  }
  return sum / nums.length;
}

console.log(average(2, 4, 6)); // 4
console.log(average(3, 5, 7, 9)); // 6

Конструкцията на Rest оператора позволява на функцията да получи произволен брой аргументи като масив, което прави кода много по-лесен и по-кратък. Ето още няколко примера за използване на Rest оператора в JavaScript:

Пример с Rest оператор в функция за събиране на произволен брой числа:

function sum(...nums) {
  let result = 0;
  for (let num of nums) {
    result += num;
  }
  return result;
}

console.log(sum(1, 2, 3)); // 6
console.log(sum(1, 2, 3, 4)); // 10

Пример с Rest оператор в функция, която обработва произволен брой стрингове и връща ги като един стринг, разделен със зададен разделител:

function concatenate(separator, ...strings) {
  return strings.join(separator);
}

console.log(concatenate("-", "apple", "banana", "cherry")); // "apple-banana-cherry"
console.log(concatenate(" and ", "apple", "banana", "cherry")); // "apple and banana and cherry"

Пример с Rest оператор в функция, която връща нов масив, който съдържа произволен брой елементи, но без първия:

function skipFirstItem(firstItem, ...restItems) {
  return restItems;
}

console.log(skipFirstItem(1, 2, 3, 4)); // [2, 3, 4]
console.log(skipFirstItem("a", "b", "c", "d", "e")); // ["b", "c", "d", "e"]

Rest оператора може да бъде използван за работа с произволен брой аргументи във функции, което прави кода много по-гъвкав и удобен за използване.

Spread оператор

Spread операторът също се представя с три точки (...), но той се използва за разширяване на масиви и обекти. Той може да бъде използван за създаване на нов масив или обект, който включва елементите на друг масив или обект.

Например, ако имаме два масива, можем да използваме Spread оператора, за да ги обединим в един нов масив:

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];

let newArr = [...arr1, ...arr2];

console.log(newArr); // [1, 2, 3, 4, 5, 6]

Пример с Spread оператор за копиране на масив:

let arr1 = [1, 2, 3];
let arr2 = [...arr1];

arr2.push(4);

console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3, 4]

Също така, ако имаме обект, можем да използваме Spread оператора, за да създадем нов обект, който включва свойствата на първоначалния обект, заедно с други свойства:

let obj1 = { x: 1, y: 2 };
let obj2 = { z: 3 };

let newObj = { ...obj1, ...obj2 };

console.log(newObj); // { x: 1, y: 2, z: 3 }

Пример с Spread оператор за създаване на нов обект от два обекта с еднакви свойства, като презапишем стойността на единия ключ:

let obj1 = { x: 1, y: 2 };
let obj2 = { x: 3, z: 4 };

let newObj = { ...obj1, ...obj2, x: 5 };

console.log(newObj); // { x: 5, y: 2, z: 4 }

Пример с Rest оператор в метод за масив, който връща максимален елемент:

let arr = [5, 3, 8, 1, 9];

let max = Math.max(...arr);

console.log(max); // 9