Автор оригинала: FreeCodeCamp Community Member.
Джоанна Гаудин
Как оператор по распространению, так и параметром покоя записываются как три последовательных точка (…). У них есть что-то еще общее?
Оператор распространения (…)
Оператор распространения был введен в ES6. Это дает вам возможность расширить ИТЕРАЛНЫЕ объекты на несколько элементов. Что это на самом деле значит? Давайте проверим некоторые примеры.
const movies = ["Leon", "Love Actually", "Lord of the Rings"];console.log(...movies);
Принты:
const numbers = new Set([1, 4, 5, 7]);console.log(...numbers);
Принты:
Вы можете заметить, что как массив из первого примера, так и множества от второго, был расширен в их отдельные элементы (строки и цифры соответственно). Как это может быть любое использование, вы можете спросить.
Наиболее распространенное использование, вероятно, объединяет массивы. Если вам когда-нибудь приходилось делать это во времена перед оператором распространения, вы, вероятно, использовали CONCAT ()
метод.
const shapes = ["triangle", "square", "circle"];const objects = ["pencil", "notebook", "eraser"];const chaos = shapes.concat(objects);console.log(chaos);
Принты:
Это не так уж плохо, но то, что предлагает оператор Spread Operator – это ярлык, который делает ваш код выглядеть более читаемым:
const chaos = [...shapes, ...objects];console.log(chaos);
Принты:
Вот что мы получили, если бы мы попробовали делать то же самое без Оператор распространения:
const chaos = [shapes, objects];console.log(chaos);
Принты:
Что здесь случилось? Вместо того, чтобы объединить массивы, мы получили Хаос
массив с Формы
Массив на индекс 0 и Объекты
Массив на индекс 1.
Параметр отдыха (…)
Вы можете подумать о параметре отдыха как противоположность оператора распространения. Так же, как оператор по распространению позволяет вам расширить массив в свои отдельные элементы, параметр rest позволяет разблокировать элементы обратно в массив.
Назначение значений массива на переменные
Давайте посмотрим на следующий пример:
const movie = ["Life of Brian", 8.1, 1979, "Graham Chapman", "John Cleese", "Michael Palin"];const [title, rating, year, ...actors] = movie;console.log(title, rating, year, actors);
Принты:
Параметр отдыха давайте возьмем значения фильм
Массив и назначьте их нескольким отдельным переменным, используя Разрушение Отказ Таким образом Название
, Рейтинг
и Год
назначаются первые три значения в массиве, но где происходит реальная магия Актеры
Отказ Благодаря параметрам отдыха Актеры
Получает присвоение оставшихся значений фильм
массив, в форме массива.
Вариадические функции
Вариадические функции – это функции, которые принимают неопределенное количество аргументов. Один хороший пример – сумма ()
Функция: Мы не можем узнать аванс, сколько аргументов будет передано ему:
sum(1, 2);sum(494, 373, 29, 2, 50067);sum(-17, 8, 325900);
В более ранних версиях JavaScript этот вид функции будет обрабатываться с использованием Аргументы объекта, который является настроенным объектом, доступным в качестве локальной переменной внутри каждой функции. Он содержит все значения аргументов, переданных функции. Давайте посмотрим, как сумма ()
Функция может быть реализована:
function sum() { let total = 0; for(const argument of arguments) { total += argument; } return total;}
Это работает, но это далеко не идеально:
- Если вы посмотрите на определение для
сумма ()
Функция, у него нет никаких параметров. Это может быть довольно вводит в заблуждение. - Это может быть трудно понять, если вы не знакомы с объектом аргументов (как в: где Hek – это
аргументы
исходя из?!)
Вот как мы написали ту же функцию с параметром покоя:
function sum(...nums) { let total = 0; for(const num of nums) { total += num; } return total;}
Обратите внимание, что для ... в
петля была заменена на для … из петля также. Мы сделали наш код более читаемым и кратким сразу.
Hallelujah ES6!
Вы только начинаете свое путешествие с программированием? Вот некоторые статьи, которые могут вас заинтересовать: