Оператор распространения и отдыха — одна из самых крутых функций ECMA6. Использование этих операторов делает наш код легко читаемым, а также простым в использовании.
Оператор спреда
Оператор Spread позволяет расширять итерируемые объекты (массивы, объекты и строки) до отдельных аргументов. Он обозначается тремя точками (…), за которыми следуют переменные или массив/строка/объект, который мы хотим распаковать/развернуть. Посмотрим, как это работает
Напишите приведенный выше код и запустите его в консоли. В первой консоли вы получите массив в качестве вывода. Но во второй консоли вы получите только значения без массива. Три точки (…), которые вы там видите, называются оператором спреда. Он просто распаковывает ряд значений в отдельные значения.
Оператор Spread распаковывает массив на отдельные элементы.
Давайте посмотрим на другой пример
мы видим, что операция распространения расширила строку и массив на отдельные элементы.
Мы можем объединить два массива с помощью оператора расширения
Мы можем скопировать массив, используя оператор расширения в литералах массива
Хорошо то, что это не влияет на первый массив.
Как и выше, мы можем копировать объекты с помощью оператора распространения
Мы можем деструктурировать массив с помощью оператора расширения
оператор распространения в функциях:Давайте рассмотрим пример из документов MDN.
Здесь происходит следующее: (…numbers) распаковывает массив так, что консоль интерпретирует его как:
consoel.log(sum(1,2,3))
Оператор Rest преобразует массив в параметры
Кроме того, мы можем использовать оператор распространения в аргументах:
Давайте посмотрим пример. Мы создадим функцию для добавления. Мы объявляем функцию с тремя параметрами. Но если мы дадим ему 4 аргумента, он все равно будет работать, но будут использоваться только первые три аргумента.
Но мы можем решить это с помощью оператора распространения
теперь вы можете добавлять неограниченное количество номеров с оператором спреда. Другое использование распространения здесь. Давайте посмотрим на изображение ниже.
Оператор распространения также можно использовать с конструктором
Остальные параметры:
Оператор Rest и оператор Spread выглядят одинаково, но немного по-другому.
Операторы расширения расширяют массив до параметров. А вот оператор Rest делает наоборот, собирает параметры и превращает их в массив.
Мы можем включить это в определение функции, просто используя три точки (…), за которыми следует имя массива, который будет их содержать. Это означает, что мы приносим эти параметры сюда и делаем их массивом.
Rest Parameter должен быть последним аргументом.
В этом коде мы будем получать аргументы через параметр rest
Выполним сложение, используя оставшийся параметр
Здесь происходит следующее: все аргументы, которые мы здесь передаем, преобразуются в массив. После этого мы запускаем цикл for по массиву и завершаем добавление.