PassFront
  1. PassFront
  2. База знаний
  3. Продвинутые темы

Что такое Redux?

Продвинутые темы

Redux — это предсказуемый контейнер состояния для JavaScript-приложений. Он хранит всё состояние в одном месте (store) и меняет его только через строго описанные действия.

Три принципа

  1. Единый источник истины — всё состояние в одном объекте store.
  2. Состояние только для чтения — менять его можно лишь через dispatch действий (actions).
  3. Изменения через чистые функции — редьюсеры принимают текущее состояние и action, возвращают новое состояние без мутаций.

Поток данных (однонаправленный)

// action — что произошло
{ type: 'counter/incremented', payload: 1 }

// reducer — как меняется состояние
function reducer(state = { count: 0 }, action) {
  switch (action.type) {
    case 'counter/incremented':
      return { ...state, count: state.count + action.payload };
    default:
      return state;
  }
}

store.dispatch({ type: 'counter/incremented', payload: 1 });

UI → dispatch(action) → reducer → новый state → перерисовка UI.

Redux Toolkit

Современный стандарт: убирает бойлерплейт, включает Immer (можно «мутировать» черновик состояния), createSlice, createAsyncThunk.

Когда нужен

  • Сложное общее состояние, много источников изменений.
  • Для простых случаев достаточно useState/Context.

Коротко для собеседования

Redux — предсказуемое хранилище состояния: единый store, изменения только через actions и чистые reducers, однонаправленный поток данных. Сейчас используют Redux Toolkit, снижающий бойлерплейт.

Другие вопросы раздела