Остаточные параметры в JavaScript ES6

Development | Amber | Комментировать запись

В JavaScript встроенные функции часто поддерживают произвольное количество аргументов. С выходом спецификации ES6/ES2015 появились остаточные параметры, или rest-параметры – это способ работы с функциями, которым передано неопределённое число аргументов. Другими словами, при помощи остаточных параметров вы можете создавать новые функции с произвольным количеством аргументов.

Давайте посмотрим на такой код:

function myFunc(...someArgs) {
  for (let i = 0; i < rest.length; i++) {
    console.log(`Argument ${ i + 1 }: ${ rest[i] }`);
  }
}

Остаточные параметры здесь обозначаются символом троеточия (…). Так JavaScript понимает, что оставшиеся параметры нужно собрать в массив.

Теперь вызовем функцию:

myFunc('Paul', 'John', 'Ringo');

Вот что мы получим в консоли:

Argument 1: Paul
Argument 2: John
Argument 3: Ringo

Также при помощи rest-параметров можно присвоить несколько параметров переменным, а оставшиеся передать в массив.

Примечание: Поскольку rest-параметры собирают оставшиеся аргументы, они всегда должны находиться в конце списка. Если поместить что-то после них, вы получите ошибку.

function f(arg1, ...rest, arg2) {
}

До выхода ES6 в JavaScript можно было использовать массивоподобный объект arguments (его можно использовать до сих пор). Но при этом требовалось больше шаблонного кода, чтобы иметь возможность обрабатывать аргументы как реальный массив. То есть у arguments есть серьезный минус – он похож на массив, но все же массивом не является, следовательно, он и не поддерживает методов массивов. Кроме того, он всегда собирает все аргументы функции и, в отличие от rest-параметров, не позволяет извлечь их часть.

Деструктуризация

В качестве остаточного параметра можно определить массив, и тогда переданные аргументы будут разбиты на массив:

function myFunc(...[name1, name2, name3]) {
  console.log(name1, name2, name3);
}

let names = ['Paul', 'John', 'Ringo'];
myFunc(names);

Заключение

Больше информации об остаточных параметрах вы найдете здесь.

Не забывайте, что троеточием обозначаются не только остаточные параметры, но и spread-оператор. Чтобы не перепутать их в коде, важно запомнить следующее:

• Троеточие стоит в конце списка аргументов – перед вами остаточные параметры, которые собирают оставшиеся аргументы в массив.
• Троеточие находится в другом месте в коде (в вызове функции, например) – значит, перед вами spread-оператор, который извлекает элементы массива.

Читайте также: Как работает spread-оператор в JavaScript