文章來源

Поскольку мой класс React рассказал о

spread() 
…

Итак, я прочитал статью о

...

Синтаксис расширения (…) позволяет расширять итерируемый объект (可迭代者), такой как выражение массива или строку, в тех местах, где ожидается ноль или более аргументов (для вызовов функций) или элементов (для литералов массива). или выражение объекта, которое должно быть расширено, в местах, где ожидается ноль или более пар ключ-значение (для литералов объекта).

Попробуй

применить () метод

Описание

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

В приведенном выше примере определенная функция принимает x, y и z в качестве аргументов и возвращает сумму этих значений. Значение массива также определено.

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

…numbers

Если массив содержит более трех чисел, например. [1,2,3,4], то все равно будет работать нормально, ожидайте, что все четыре будут переданы, но будут использоваться только первые три, если вы не добавите больше аргументов в функцию,

e.g.:

Вышеприведенный пример является несколько жестким; реальная ценность синтаксиса распространения заключается в том, что он работает с одним и тем же значением, независимо от того, сколько элементов содержится в объекте, массиве и т. д.

Он обычно используется, когда вы хотите

  • добавить новый элемент в локальное хранилище данных,
  • или отобразить все сохраненные элементы плюс новое дополнение.

Очень простая версия такого действия может выглядеть так:

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

Синтаксис остального (параметры)

Синтаксис Rest выглядит точно так же, как синтаксис расширения. В некотором смысле синтаксис rest противоположен синтаксису распространения. Синтаксис Spread расширяет массив на его элементы, а синтаксис rest собирает несколько элементов и конденсирует их в один элемент. См. параметры покоя.

Пример

Разброс вызовов функций

Заменить применить()

Обычно Function.prototype.apply() in используется в тех случаях, когда вы хотите использовать элементы массива в качестве аргументов функции.

С синтаксисом распространения вышеприведенное можно записать как:

Любой аргумент в списке аргументов может использовать синтаксис расширения, а синтаксис расширения можно использовать несколько раз.

Подать заявку на нового оператора

При вызове конструктора с new невозможно напрямую использовать массив и

apply()   (apply() does a [[call]] and not a [[Construct]] ).

Однако массив можно легко использовать с newблагодаря синтаксису распространения:

Чтобы использовать newс массивом параметров без синтаксиса распространения, вам нужно будет сделать это косвенночерез частичное применение:

Распространение в литералах массива

Более мощный литерал массива

Без расширенного синтаксиса для создания нового массива с использованием существующего массива как его части синтаксиса литерала массива больше недостаточно, и вместо этого императивный код должен использовать комбинацию push(), splice(), concat() и т. д. С синтаксисом распространения это становится намного более кратким:

Так же, как распространение для списков аргументов,

может использоваться в любом месте литерала массива и может использоваться более одного раза.

Скопируйте массив

Лучший способ конкатенации массивов

Array.prototype.concat()часто используется для объединения массива в конец существующего массива. Без синтаксиса распространения это делается так:

С синтаксисом распространения это становится:

Array.prototype.unshift() часто используется для вставки массива значений в начало существующего массива. Без синтаксиса распространения это делается так:

С синтаксисом распространения это становится:

Распространение в литералах объектов

Предложение Rest/Spread Properties for ECMAScript (ES2018) добавило свойства распространения в object literals. Оно копирует собственные перечисляемые свойства из предоставленного объекта в новый объект.

Поверхностное клонирование (за исключением прототипа) или слияние объектов теперь возможно с использованием более короткого синтаксиса, чем Object.assign().

Обратите внимание, что Object.assign() можно использовать для изменения объекта, в то время как синтаксис расширения не может

Вы не можете наивно повторно реализовать функцию Object.assign() с помощью одного оператора распространения:

В приведенном выше примере синтаксис расширения работает не так, как можно было бы ожидать: он распространяет массив аргументов в литерал из-за параметра rest. Вот реализация merge с использованием оператора распространения, поведение которого похоже на Object.assign(), за исключением того, что он не запускает сеттеры и не мутирует какой-либо объект:

Только для итерируемых объектов 可迭代

Синтаксис расширения (кроме свойств распространения) может применяться только к итерируемым объектам, таким как Array, или с повторяющейся функцией, такой как

map() , reduce() 

и

assign()

Многие объекты не являются итерируемыми, в том числе Object:

Чтобы использовать синтаксис распространения с этими объектами, вам нужно будет предоставить функцию итератора.

Распространение со многими значениями

При использовании синтаксиса расширения для вызовов функций помните о возможности превышения ограничения длины аргумента движка JavaScript. Подробнее см. apply().