Перейти к основному содержимому
Неофициальный Бета-перевод

Эта страница переведена PageTurner AI (бета). Не одобрена официально проектом. Нашли ошибку? Сообщить о проблеме →

Базовые концепции редюсеров

Как описано в "Основы Redux" Часть 3: Состояние, действия и редюсеры, функция редюсера в Redux:

  • Должна иметь сигнатуру (previousState, action) => newState, аналогичную функции, передаваемой в Array.prototype.reduce(reducer, ?initialValue)

  • Должна быть "чистой" (pure), что означает:

    • Не должна выполнять побочные эффекты (например, вызовы API или изменение нелокальных объектов/переменных)
    • Не должна вызывать нечистые функции (такие как Date.now или Math.random)
    • Не должна мутировать свои аргументы. При обновлении состояния редюсер не должен изменять существующий объект состояния напрямую. Вместо этого он должен создавать новый объект с необходимыми изменениями. Этот же подход применяется к любым вложенным объектам в состоянии, которые обновляет редюсер.
Примечание о неизменяемости, побочных эффектах и мутациях​

Мутации не рекомендуются, поскольку они нарушают работу time-travel отладки и функции connect в React Redux:

  • Для time-travel отладки Redux DevTools ожидают, что воспроизведение записанных действий приведёт к конкретному состоянию без дополнительных изменений. Побочные эффекты вроде мутаций или асинхронного поведения изменят поведение между шагами time-travel, нарушая работу приложения.
  • В React Redux функция connect проверяет изменения пропсов из mapStateToProps для определения необходимости обновления компонента. Для оптимизации connect использует сокращения, полагающиеся на неизменяемость состояния, и поверхностные проверки равенства ссылок. Это означает, что изменения объектов и массивов через прямую мутацию не будут обнаружены, и компоненты не перерисуются.

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

Из-за этих правил критически важно полностью понять следующие базовые концепции перед изучением специфических техник организации редюсеров в Redux:

Основы редюсеров Redux​

Ключевые концепции:

  • Мышление в терминах состояния и его структуры

  • Делегирование ответственности за обновление по частям состояния (композиция редюсеров)

  • Редюсеры высшего порядка

  • Определение начального состояния редюсера

Материалы для изучения:

Чистые функции и побочные эффекты​

Ключевые концепции:

  • Побочные эффекты

  • Чистые функции

  • Мышление в терминах комбинирования функций

Рекомендуемые материалы:

Управление неизменяемыми данными​

Ключевые концепции:

  • Мутабельность vs неизменяемость

  • Безопасное обновление объектов и массивов без мутаций

  • Избегание функций и операторов, изменяющих состояние

Рекомендуемые материалы:

Нормализация данных​

Ключевые концепции:

  • Структура и организация базы данных

  • Разделение реляционных/вложенных данных на отдельные таблицы

  • Хранение единственного определения для каждого элемента

  • Ссылки на элементы через ID

  • Использование объектов с ключами-ID как lookup-таблиц и массивов ID для отслеживания порядка

  • Установление связей между элементами

Рекомендуемые материалы: