跳到主要内容

Redux 是一个用于 JavaScript 应用的状态管理库，它提供了一个可预测的状态容器。Redux 于 2015 年上线，由 Dan Abramov 开发。它不是传统意义上的框架或库，而是一个应用数据流框架，主要用于应用状态的管理。

Redux 的核心概念是：单一事实来源（Single Source of Truth），即整个应用的状态储存在一个单一的 Store 中，这使得状态管理更加可预测和可维护。

  • 优点：
    • 可预测性：状态变化是可预测的
    • 可维护性：代码结构清晰，易于维护
    • 易于调试：开发者工具可以实时跟踪状态变化
    • 测试便捷：纯函数使测试变得简单
    • 服务端渲染：支持服务端渲染，提高 SEO
  • 缺点：
    • 增加复杂性：需要管理更多的代码和概念
    • 样板代码多：对于小型应用可能过于复杂
    • 内存使用：状态不可用，每次更新都创建新对象
    • 设计限制：有固定的设计模式和使用方式

一、三大原则​

Redux 核心设计遵循三大原则，这些原则确保了状态的可预测性、可维护性和调试友好性。

1. 单一事实来源 （Single Source of Truth）​

应用程序的全局状态储存在一个单一的、不可变的 store 中，这个状态以对象树的形式存在/这使得应用的状态管理更集中，便于调试和追踪状态变化，同时也让服务端渲染、状态持久化等场景更易实现。

  • 所有状态集中在一个 store 中，避免了多源状态导致的不一致问题
  • 方便调试：通过单一 Store 可以全局观察状态变化，支持时间旅行（Time Travel debugging）
  • 简化状态持久型：只需序列化整个 Store 即可保存或恢复应用状态

2. 状态是只读的 （state is Read-Only）​

不能直接修改和突变（mutate）状态。改变状态的唯一方式就是触发一个 action （一个描述“发生了什么”的普通 JavaScript 对象）。这种设计保证了状态可变的可预测性，所有修改都有明确的处罚源头。

  • 禁止直接修改状态（如 state.todos.push(newTodo) ），强调用 Action 显式声明变更意图，确保所有状态可追踪
  • 解耦状态变更的触发与具体逻辑：Action 描述“要做什么”，而具体如何修改状态后续的 Reducer 决定

3. 使用纯函数执行修改（Changes are Made with Pure Functions）​

状态的变化通过 reducer 实现，reducer 是一个纯函数（无副作用、输入相同则输出一定相同），它接收当前的一个状态和一个 action，返回一个新的状态对象（而非修改原状态）。纯函数的特性确保了状态变化的可测试性和可追踪性。

  • 相同的输入（State + Action）必须返回相同的输出（新 State）
  • 无副作用！ 不修改外部变量、不发起异步请求