Оператор распространения и отдыха — одна из самых крутых функций ECMA6. Использование этих операторов делает наш код легко читаемым, а также простым в использовании.

Оператор спреда

Оператор Spread позволяет расширять итерируемые объекты (массивы, объекты и строки) до отдельных аргументов. Он обозначается тремя точками (…), за которыми следуют переменные или массив/строка/объект, который мы хотим распаковать/развернуть. Посмотрим, как это работает

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

Оператор Spread распаковывает массив на отдельные элементы.

Давайте посмотрим на другой пример

мы видим, что операция распространения расширила строку и массив на отдельные элементы.

Мы можем объединить два массива с помощью оператора расширения

Мы можем скопировать массив, используя оператор расширения в литералах массива

Хорошо то, что это не влияет на первый массив.

Как и выше, мы можем копировать объекты с помощью оператора распространения

Мы можем деструктурировать массив с помощью оператора расширения

оператор распространения в функциях:Давайте рассмотрим пример из документов MDN.

Здесь происходит следующее: (…numbers) распаковывает массив так, что консоль интерпретирует его как:

consoel.log(sum(1,2,3))

Оператор Rest преобразует массив в параметры

Кроме того, мы можем использовать оператор распространения в аргументах:

Давайте посмотрим пример. Мы создадим функцию для добавления. Мы объявляем функцию с тремя параметрами. Но если мы дадим ему 4 аргумента, он все равно будет работать, но будут использоваться только первые три аргумента.

Но мы можем решить это с помощью оператора распространения

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

Оператор распространения также можно использовать с конструктором

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

Оператор Rest и оператор Spread выглядят одинаково, но немного по-другому.

Операторы расширения расширяют массив до параметров. А вот оператор Rest делает наоборот, собирает параметры и превращает их в массив.

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

Rest Parameter должен быть последним аргументом.

В этом коде мы будем получать аргументы через параметр rest

Выполним сложение, используя оставшийся параметр

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

Спасибо, что прочитали мою статью. Подпишитесь на меня, если вам нравятся мои статьи.