Создать чистую функцию для объединения объектов - PullRequest
Новая
       7

Создать чистую функцию для объединения объектов

0 голосов
/ 01 сентября 2018

Допустим, у меня есть переменные 'state' и 'newState'. Я хотел бы создать чистую функцию, которая возвращает 'состояние', обновленное со свойствами (и вложенными свойствами) 'newState'. Вот пример: 

const state = {id:1, name:'aName', description: 'aDescription'};

const newState = {id:1, name:'newName', subItems: {id:3, type:'whatever'}};

Функция вернет: 

{id:1, name:'newName', subItems: {id:3, type:'whatever'}}

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

У кого-нибудь есть идеи?

Ответы [ 2 ]

0 голосов
/ 01 сентября 2018

Object.assign может быть полезно для обновления state: 

const state = {id:1, name:'aName', description: 'aDescription'};

const newState = {id:1, name:'newName', subItems: {id:3, type:'whatever'}};

Object.assign(state,newState)//<-- updates state

console.log(state)

Как указывает NicholasKyriakides, чтобы создать новый объект, вы должны добавить {} в начале.

0 голосов
/ 01 сентября 2018

Вы можете использовать синтаксис :

Свойства Rest / Spread для предложения ECMAScript (этап 4) добавляют свойства распространения к литералам объекта. Он копирует собственные перечисляемые свойства из предоставленного объекта в новый объект.

... или Object.assign с первым аргументом, являющимся пустым объектом:

Метод Object.assign () используется для копирования значений всех перечисляемых собственных свойств из одного или нескольких исходных объектов в целевой объект. Он вернет целевой объект. 

const state = {id:1, name:'aName', description: 'aDescription'};
const newState = {id:1, name:'newName', subItems: {id:3, type:'whatever'}};

// Example with spread syntax:
const result1 = { ...state, ...newState };

// Example with Object.assign:
// @NOTE: Providing an empty `{}` as the 1st argument,
// ensures you don't mutate `state`.
const result2 = Object.assign({}, state, newState);

console.log(result1);
console.log(result2);

Примечания:

  • Расширяя комментарий @ user633183, оба способа производят слияние shallow . Они идут только на 1 уровень. Если вы хотите выполнить слияние deep , я предлагаю вам проверить этот ответ .

  • На момент написания этой статьи Object.assign имел лучшую межбраузерную поддержку, чем распространенный синтаксис для литералов объектов, как вы можете видеть здесь . Хотя это не должно быть проблемой, если вы правильно используете Babel или любой другой транспортер, стоит упомянуть.

  • Мы обычно не называем функции неизменяемыми (на самом деле они могут быть такими, поскольку сами являются значениями, но, вероятно, это не то, что вы имеете в виду в контексте вашего вопроса). Значения могут быть неизменными , функции могут быть pure ; это означает, что они не вызывают побочных эффектов , таких как изменение их аргументов.

...