Я впервые познакомился с методом Object.assign (), когда учился создавать чистые функции в React для управления состоянием.

Чистая функция - это функция, возвращаемое значение которой определяется только входными значениями без наблюдаемых побочных эффектов.

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

Функции редуктора React часто используют метод Object.assign () для возврата нового состояния, однако синтаксис и внутренняя работа не сразу понятны для новичков.

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

Вот подробное описание того, как работает Object.assign ():

Что именно делает Object.assign ()?

Он позволяет нам создавать копию существующего объекта (исходного объекта) и изменять его значения, возвращая НОВЫЙ объект (целевой объект). Поскольку мы создаем новый объект, Object.assign () чист. Исходный объект остается неизменным.

Каков синтаксис?

Object.assign () может принимать множество параметров в зависимости от копируемых и изменяемых данных. Первым параметром будет целевой объект, который также является возвращаемым значением. Если мы создаем новый объект, первый параметр будет выглядеть так:

Object.assign( {}, )
-> {}

Следующим параметром будет исходный объект и перечисления, из которых мы копируем.

const obj = {name: "Arya Stark"} 
-> {name: "Arya Stark"} 
const newObj = Object.assign({}, obj) 
-> {name: "Arya Stark"} 
obj === newObj 
->false

Из нашего сравнения последней строки кода мы видим, что фактически создаем новый объект, отличный от исходного. Наш следующий шаг - добавить наши модификации. Чтобы добавить значение или перезаписать существующее значение из исходного объекта, просто добавьте его как параметр. Вы можете как добавлять, так и перезаписывать значения в одном параметре, разделяя значения запятыми.

const addValue = Object.assign({}, obj, {kingdom: 'Winterfell'})
-> {name: "Arya Stark", kingdom: "Winterfell"} 
const changeValue = Object.assign({}, addValue, {name: 'Ned Stark'}) -> {name: "Ned Stark", kingdom: "Winterfell"} 
const addAndChange = Object.assign({}, obj, {name: 'Sansa Stark', kingdom: 'Winterfell'}) 
-> {name: "Sansa Stark", kingdom: "Winterfell"}

Вот и все - простое введение в использование Object.assign (). Хотя этот метод кажется простым, он становится более сложным при попытке использовать источник из двух разных объектов или при попытке скопировать неперечислимые свойства. Ознакомьтесь с этим сообщением в блоге для получения более подробной информации.

Первоначально опубликовано на jendobes.github.io.