Рекомендации по использованию JavaScript - оператор Rest

JavaScript - очень щадящий язык. Легко написать код, который работает, но содержит ошибки.

В этой статье мы рассмотрим, почему использование остальных операторов лучше, чем их старые альтернативы.

Использование параметров отдыха вместо arguments Object

Остальные параметры - лучший способ получить все аргументы от функции. Он работает со всеми видами функций.

В то время как старый объект arguments работает только с традиционными функциями старого стиля.

Остальной оператор обозначается символом ... в аргументе функции.

Мы можем использовать его для помещения всех аргументов в массив или только аргументов, которые не были установлены как значения существующих параметров, которые предшествуют выражению остальных параметров.

Например, если у нас есть следующая функция:

const foo = (a, b, ...args) => console.log(a, b, args);

Затем, когда мы назовем это следующим образом:

foo(1, 2, 3, 4, 5);

Получаем, что a равно 1, b равно 2, а c - это массив [3, 4, 5].

Как мы видим, аргументы, которые не были заданы как значения параметров функции, все помещаются в массив, которым мы можем легко манипулировать.

Мы также можем поместить все аргументы в массив, написав следующее:

const foo = (...args) => console.log(args);

Тогда мы получаем, что args это [1, 2, 3, 4, 5], когда мы вызываем его, записывая foo(1, 2, 3, 4, 5);.

Как видим, остальные параметры отлично работают со стрелочными функциями. Он одинаково хорошо работает с традиционными функциями.

Это намного лучше, чем то, что мы делали раньше, когда использовали arguments.

Если мы вернемся к использованию arguments, тогда нам придется использовать традиционные функции, поскольку стрелочные функции не привязываются к объекту arguments.

Например, мы должны определить функцию следующим образом, чтобы использовать ее:

function foo() {
  console.log(arguments);
}

Затем мы называем это следующим образом:

foo(1, 2, 3, 4, 5);

Мы получаем:

Arguments(5) [1, 2, 3, 4, 5, callee: ƒ, Symbol(Symbol.iterator): ƒ]

в выводе журнала консоли.

Это потому, что объект arguments не является массивом. Это повторяющийся объект, подобный массиву.

Все, что мы можем сделать, это перебрать его по его входу, используя цикл for по его индексу, как мы это делаем в следующем коде:

function foo() {
  for (var i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
  }
}

Как мы видим, объект arguments имеет свойство length, поэтому мы можем перебирать записи по его индексу, используя нотацию скобок, как мы это делаем с массивами.

Мы также можем выполнить цикл с помощью цикла for...of, поскольку это итеративный объект, подобный массиву. Следовательно, мы можем написать следующий код:

function foo() {
  for (const a of arguments) {
    console.log(a);
  }
}

Однако мы не можем сделать с ним ничего такого, что может сделать массив, например, вызвав для него метод map или filter.

Скорее всего, мы должны преобразовать объект arguments в массив, чтобы мы могли что-то с ним сделать. Если мы хотим преобразовать его в массив, нам нужно проделать дополнительную работу, чтобы преобразовать его в массив, чтобы мы могли делать с ним больше.

Для этого мы должны вызвать метод slice для пустого объекта, а затем преобразовать this, который мы использовали в срезе, в объект arguuments, чтобы он возвращал массив.

Например, мы можем написать следующий код для преобразования объекта arguments в массив:

function foo() {
  const args = [].slice.call(arguments, 0);
  console.log(args);
}

В приведенном выше коде мы преобразовали объект arguments в массив, вызвав метод slice прототипа массива со значением this, установленным как arguments, чтобы он возвращал массив.

Это работает, потому что метод slice проходит через массив, чтобы выполнить нарезку. Как мы видим, мы можем перебрать объект argument с помощью обычного цикла, поскольку он имеет свойство length, и мы можем получить доступ к его значениям по его индексу.

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

function foo() {
  const args = Array.prototype.slice.call(arguments, 0);
  console.log(args);
}

Он делает то же самое, вызывая метод экземпляра массива slice, но с помощью call для изменения this внутри метода slice на объект arguments.

Если мы вернемся в современность, мы также можем использовать оператор распространения для преобразования объекта arguments в массив следующим образом:

function foo() {
  const args = [...arguments];
  console.log(args);
}

Заключение

Параметры отдыха - полезная функция в современном JavaScript. Это позволяет нам получать аргументы функции в виде массива. Это намного лучше, чем старый способ с объектом arguments, поскольку он работает только с традиционными функциями, и нам нужно поработать, чтобы преобразовать его в массив.