Должен ли редуктор в Redux строго возвращать новый объект состояния?

Question

Одно из правил редуктора в Redux: мы должны рассматривать состояние как доступное только для чтения и возвращать новый объект как новое состояние.

Но есть одна серая область: она должна строго возвращать новый объект как состояние, или мы можем вернуть тот же объект состояния?

Кажется, глядя на общий код, такой как:

function favoriteColors(state, action) {
  if (state === undefined) {
    state = [];
  }

  if (action.type === 'ADD') {
    return Array.from(new Set([...state, action.color]));  // new array
  } else if (action.type === 'REMOVE') {
    return state.filter(color => color !== action.color);  // new array
  } else {
    return state;
  }
}

Когда action.type неизвестно, то то же состояние объект возвращается. Таким образом, правило заключается в том, что редуктор не обязательно должен возвращать новый объект состояния, но может возвращать тот же самый. Но строгое правило: государство должно быть доступно только для чтения?

Answer 1

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

function goodReducer(state, action) {
  return state;
}

function badReducer(state, action) {
  state.counter = (state.counter || 0) + 1;
  return state;
}

Причина этого заключается в том, что для обеспечения корректности и актуальности отображаемого DOM через диспетчер должны проходить обновления состояния.

В частности:

• Мутирование объектов в неконтролируемых объектах может сделать недействительными кэши (например, shouldComponentUpdate)
• Мутирование объектов может привести к отображению несогласованного состояния (например, если мутация происходит во время render)

Возврат неизмененного состояния - это нормально. На самом деле, библиотеки вроде Immutable. js часто делают это.