Как работает хранилище (store) в Redux?
Этот вопрос проверяет понимание роли хранилища (store) в Redux, его назначения и работы.
Короткий ответ
Хранилище (store) в Redux управляет состоянием всего приложения. Оно предоставляет методы для получения текущего состояния (getState), отправки действий (dispatch) и подписки на изменения (subscribe). Хранилище связывает редьюсеры с действиями, чтобы обновлять состояние.
Длинный ответ
Хранилище (store) — это объект, который содержит состояние всего приложения и предоставляет API для работы с этим состоянием. Оно создается с помощью функции createStore и принимает редьюсер как аргумент.
Основные методы хранилища:
getState:
Возвращает текущее состояние приложения.
const state = store.getState();
console.log(state);dispatch:
Используется для отправки действий. После вызова dispatch, редьюсеры обрабатывают действие и возвращают обновленное состояние.
store.dispatch({ type: 'INCREMENT' });subscribe:
Позволяет подписаться на изменения состояния. Каждый раз, когда состояние обновляется, вызывается переданная функция.
const unsubscribe = store.subscribe(() => {
console.log('State updated:', store.getState());
});
// Чтобы отменить подписку:
unsubscribe();Пример полного использования хранилища:
import { createStore } from 'redux';
// Редьюсер
function counterReducer(state = 0, action) {
switch (action.type) {
case 'INCREMENT':
return state + 1;
case 'DECREMENT':
return state - 1;
default:
return state;
}
}
// Создание хранилища
const store = createStore(counterReducer);
// Подписка на изменения
store.subscribe(() => {
console.log('Текущее состояние:', store.getState());
});
// Отправка действий
store.dispatch({ type: 'INCREMENT' });
store.dispatch({ type: 'DECREMENT' });Хранилище обеспечивает:
- Централизованное состояние: Все данные хранятся в одном месте.
- Предсказуемость: Изменения состояния происходят только через действия и редьюсеры.
- Возможность отслеживания: Благодаря методам subscribe и инструментам, таким как Redux DevTools.
Работа хранилища позволяет эффективно управлять состоянием, даже в больших приложениях с многочисленными компонентами.