Распространение синтаксиса и остальных параметров: понимание разницы

В ES2015 две новые функции — синтаксис распространения и остальные параметры — предоставляют мощные способы манипулировать массивами и объектами. Хотя оба могут показаться похожими, они служат разным целям и каждый имеет свою уникальную функциональность.

Синтаксис распространения

Синтаксис распространения (представленный тремя точками "..." ) позволяет вам разложить или расширить итерацию (например, массив или объект) на отдельные элементы внутри другой итерации. Эта функция позволяет удобно объединять или объединять несколько массивов или объектов в новый.

Например, давайте рассмотрим следующий код:

var abc = ['a', 'b', 'c'];
var def = ['d', 'e', 'f'];
var alpha = [ ...abc, ...def ];
console.log(alpha); // alpha == ['a', 'b', 'c', 'd', 'e', 'f'];

В этом фрагменте ...abc и ... Синтаксис распространения def расширяет массивы abc и def на отдельные элементы, создавая новый альфа-массив, содержащий все элементы из обоих массивов.

Остальный параметр

С другой стороны , параметр rest (обозначается тремя точками "...", которым предшествует идентификатор) собирает все оставшиеся аргументы, переданные функции, в один массив. Параметр rest должен быть последним параметром в списке параметров функции.

Пример действующего параметра rest:

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

let result = sumAll(1, 2, 3, 4, 5);
console.log(result); // result == 15

В этом коде параметр ...numbers rest собирает оставшиеся аргументы, переданные в функцию sumAll (в данном случае 1, 2, 3, 4 и 5), и создает один массив чисел.