Должен ли редуктор в 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, часто делают это.