React 中 Redux 的核心概念是什么？

推荐答案

Redux 的核心概念包括以下几个部分：

1. Store：存储整个应用的状态树。整个应用只能有一个 Store。
2. Action：描述发生了什么的对象，是改变 State 的唯一途径。
3. Reducer：纯函数，接收旧的 State 和 Action，返回新的 State。
4. Dispatch：触发 Action 的方法，是唯一可以改变 State 的方式。
5. Subscribe：监听 State 变化的方法，用于更新 UI。

本题详细解读

Store

Store 是 Redux 的核心，它保存了整个应用的状态树。Redux 应用只有一个单一的 Store，通过 createStore 函数创建。Store 提供了以下几个方法：

• getState()：获取当前 State。
• dispatch(action)：触发 Action，更新 State。
• subscribe(listener)：注册监听器，当 State 发生变化时调用。

Action

Action 是一个普通的 JavaScript 对象，用来描述发生了什么。Action 必须包含一个 type 属性，表示 Action 的类型。其他属性可以自由定义，通常用来传递数据。

const action = {
  type: 'ADD_TODO',
  payload: 'Learn Redux'
};

Reducer

Reducer 是一个纯函数，接收旧的 State 和 Action，返回新的 State。Reducer 必须保持纯净，不能有副作用，不能直接修改 State，而是返回一个新的 State。

function todoReducer(state = [], action) {
  switch (action.type) {
    case 'ADD_TODO':
      return [...state, action.payload];
    default:
      return state;
  }
}

Dispatch

dispatch 是 Store 提供的一个方法，用来触发 Action。它是唯一可以改变 State 的方式。

store.dispatch({
  type: 'ADD_TODO',
  payload: 'Learn Redux'
});

Subscribe

subscribe 是 Store 提供的一个方法，用来注册监听器。当 State 发生变化时，监听器会被调用。

store.subscribe(() => {
  console.log('State changed:', store.getState());
});

通过这些核心概念，Redux 实现了单向数据流，使得状态管理更加可预测和易于调试。