Redux 提供了一个名为 combineReducers 的函数，它执行两项任务：

• 它生成一个函数，该函数会根据键选择状态片段后调用我们的 reducer。
• 然后将结果再次组合成单个对象。

我们一直提到神秘的 store，但还没有谈及 store 到底是什么。

在 Redux 中，store 是将 action（代表发生了什么）和 reducer（根据这些 action 更新状态）联系起来的对象。一个 Redux 应用中只有一个单一的 store。

Store 有几个职责：

• 通过 getState() 允许访问状态。
• 通过 dispatch(action) 允许更新状态。
• 持有整个应用状态。
• 使用 subscribe(listener) 注册监听器。
• 通过 subscribe(listener) 返回的函数注销监听器。

基本上，要创建 store，我们只需要 reducer。我们提到过 combineReducers 可以将多个 reducer 组合成一个。现在，要创建 store，我们将导入 combineReducers 并将其传递给 createStore：

import { createStore } from 'redux';
import todoReducer from './reducers';

const store = createStore(todoReducer);

然后，我们在应用中使用 store 的 dispatch 方法来分发 action，如下所示：

store.dispatch(addTodo({ task: '📖 Read about Redux'}));
store.dispatch(addTodo({ task: '🤔 Think about meaning of life' }));
// ...

Redux 的众多优势之一是，应用程序中的所有数据都遵循相同的生命周期模式。你的应用的逻辑更加可预测且易于理解，因为 Redux 架构遵循严格的单向数据流。

Redux 中数据生命周期的 4 个主要步骤

• 应用内部的一个事件触发了对 store.dispatch(actionCreator(payload)) 的调用。
• Redux store 用当前 state 和 action 调用根 reducer。
• 根 reducer 将多个 reducer 的输出组合成单个 state tree。

export default const currentTask(state = {}, action){
  // 处理这部分 state
  return newState;
};

export default const todos(state = [], action){
  // 处理这部分 state
  return newState;
};

export default const todoApp = combineReducers({
  todos,
  currentTask,
});

当一个 action 被发出时，todoApp 将调用两个 reducer，并将两组结果组合成单个 state tree：

return {
  todos: nextTodos,
  currentTask: nextCurrentTask,
};

• Redux store 保存根 reducer 返回的完整 state tree。新 state tree 现在就是你应用的 nextState。

用很少的文字涵盖了大量内容，如果你还没有完全理解所有部分是如何组合在一起的，不要感到畏惧。Redux 提供了一种非常强大的管理应用 state 的模式，因此需要一些练习才能习惯这些概念是很自然的。

了解更多，请查看这些资源：

• 官方 Redux 文档
• Redux 教程，由其创建者 Dan Abramov 讲解
• 深入的初学者教程

🎩 在未来的文章中，我们将探讨更高级的话题，比如使用 Redux-Saga 或 Redux Thunk 处理异步事件。