Рубрики
Без рубрики

Руководство для отдыха и распространения: часть 1

Погружение в параметр покоя и как он отличается от объекта аргументов. Теги с JavaScript, ES6, учебником, начинающим.

Что такое параметр отдыха и оператор распространения?

Как параметр покоя, так и оператор распространения выражаются в коде JavaScript AS ... Это может быть запутано, поскольку они делают противоположные вещи.

Параметр отдыха: собирает все оставшиеся элементы или аргументы в массив.

Распространение оператора: Позволяет, такие как массивы, строки или объекты, которые будут расширены в отдельные аргументы или элементы.

Давайте посмотрим на некоторые примеры, чтобы выяснить, что на самом деле значит выше.

Нырять в параметр отдыха

При определении функций в JavaScript мы можем добавить параметры. Параметры описывают аргументы, которые будут поставляться при вызове функции. В подведенном ниже у нас есть определение функции для функции щенок Это возвращает описание щенка. Имя, породы и размер – это параметры функции. Спот, таксы и маленькие – прилагаемые аргументы, когда вызывается функция.

function puppy(name, breed, size){
  var description = `${name} is a ${size} ${breed}`
  return description
}

puppy("Spot", "Dachshund", "small")

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

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

function puppy(name, breed, size, ...traits){
  console.log(traits)
  var description = `${name} is a ${size} ${breed}.`
  if (traits.length > 0) {
    return `${description} They have the following traits: ${traits.join(', ')}`
  }
  return description
}

Теперь, если мы добавим больше аргументов при вызове функции и журнала консоли Черты Мы получим дополнительные аргументы в качестве массива. Если нет дополнительных аргументов, поставляемых, то Черты будет пустой массив.

puppy("Spot", "Dachshund", "small", "playful", "intelligent", "energetic", "stubborn")
// traits will be logged as:
// `[ 'playful', 'intelligent', 'energetic', 'stubborn' ]`.
// the function will return: 
// 'Spot is a small Dachshund. They have the following traits: playful, intelligent, energetic, stubborn'
puppy("Spot", "Dachshund", "small")
// traits will be logged as []
// the function will return:
// 'Spot is a small Dachshund.'

Как рабочий оператор отличается от объекта аргументов?

При записи функций JavaScript у нас также есть доступ к Аргументы объект. Объект аргументов содержит все аргументы, которые передаются на функцию. На первый взгляд мы можем подумать, что тогда нет разницы между

  1. прохождение в параметре отдыха в качестве единственного параметра к функции и
  2. Объект аргументов

Однако преимущество в использовании параметра REST в этом случае состоит в том, что параметр REST возвращает фактический экземпляр массива. Это означает, что мы можем использовать любой метод массива напрямую. Объект аргументов не является настоящим массивом. Попытка вызвать методы массива на нее приведет к ошибке.

Использование объекта аргументов:

Если у нас есть новая функция Щепины И назовите его с некоторыми аргументами, мы можем записать объект аргументов, чтобы получить все аргументы. Но если мы попытаемся использовать метод массива непосредственно на объекте, мы получаем ошибку. Мы можем обойти это, если бы мы хотели, используя Array.from (аргументы) Чтобы повернуть объект в экземпляр массива. Однако это не нужно, если мы используем оператор остальных.

function puppyTraits(){
  console.log(arguments)
  return `This puppy has the following traits: ${arguments.join(', ')}`
}

puppyTraits("playful", "intelligent", "energetic", "stubborn")
// arguments will be logged as:
/* [Arguments] {
  '0': 'playful',
  '1': 'intelligent',
  '2': 'energetic',
  '3': 'stubborn' }
*/
// the function will not return as there will be an error:
// TypeError: arguments.join is not a function

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

Та же функция с использованием параметра отдыха вместо функции аргументов. Поскольку черт сейчас – это массив, мы можем использовать любой метод массива в нашем коде!

function puppyTraits(...traits){
  console.log(traits)
  return `This puppy has the following traits: ${traits.join(', ')}`
}

puppyTraits("playful", "intelligent", "energetic", "stubborn")
// traits will be logged as:
// [ 'playful', 'intelligent', 'energetic', 'stubborn' ]
// the function will return:
// 'This puppy has the following traits: playful, intelligent, energetic, stubborn'

Надеюсь, вы сошли с лучшим пониманием того, что параметр покоя делает в JavaScript и некоторые из его случаев использования. Мы погрузимся в оператор распространения в части 2!

Если у вас есть какие-либо вопросы, комментарии или отзывы – пожалуйста, дайте мне знать. Следуйте за новыми еженедельными сообщениями о JavaScript, React, Python и Django!

Оригинал: “https://dev.to/guin/what-does-mean-in-javascript-a-guide-to-rest-and-spread-part-1-1fmd”

Читайте ещё по теме: