全新React核心技术(4-5)：Redux数据状态管理

能力缺口诊断：别把 Redux 当成黑盒来背 API

很多写过 React 的同学，一碰到跨组件状态共享就条件反射地装 Redux，然后对着复制来的 reducer、action、dispatch 一通改，跑通了事。真问到单向数据流为什么这么设计、action 到底是怎么派发到 store 的、react-redux 的 connect 背后做了什么，往往答不上来。这门课不教你怎么调 API，而是从 Flux 思想切入，带你把 Redux 的底层运转机制拆开看。如果你现在只会照搬模板代码，遇到报错只能瞎猜，这门课就是用来补这块底层逻辑缺口的。关于学习门槛，你需要熟悉 React 基本语法，清楚 props 和 state 怎么用，写过简单的组件交互。但如果你没系统学过状态管理，对 Flux 概念很模糊，或者搞不懂组件层层嵌套时数据怎么流转，正好从头补起。别假装自己什么都懂，底层逻辑缺了就老老实实补。

学习顺序与资料配合练习：从思想史到源码实现

资料包里的内容编排是有讲究的，别跳着看。建议先看 Flux 部分，别觉得它过时就不看，Redux 本质是 Flux 思想的改进，不懂单向数据流，Redux 的 action 和 dispatcher 就是空中楼阁。跟着官方的 flux-todomvc 案例走一遍源码，搞清楚 view 触发 action、dispatcher 分发、store 更新后回传 view 的闭环。接着看纯 Redux 部分，重点看原生 JS 写的计数器案例，它没用任何框架，能让你剥离 React 干扰，纯粹理解 createStore 怎么工作、reducer 怎么响应。最后看 React-Redux 部分，看待办事项案例源码时重点理解 connect 函数和 Provider 组件，搞清楚 React 组件到底怎么订阅 store 变化。练习方面，建议用资料包里的案例做对照：先自己不看源码写一遍，卡住了再回去看对应片段。写完原生版本后，试着把它改造成 react-redux 版本，对比两种写法差异。这个动手改造过程，比单纯看视频有效得多。

学完能独立做什么：手写逻辑而非照搬模板

看完这些源码解读，你应该能脱离教程，独立做几件事：一是能徒手写一个最简版的 createStore，理解内部订阅和发布机制；二是拿到复杂业务需求，能自己设计 action 类型和 reducer 结构，而不是去网上抄模板；三是遇到 react-redux 的 connect 报错或性能问题，能定位到是 mapStateToProps 触发频率过高还是订阅没正确清理。看完后试着回答这几个问题检验自己：Flux 单向数据流比双向绑定好在哪？Redux 的 reducer 为什么必须是纯函数？Provider 组件是怎么让深层子组件拿到 store 的？如果答得磕磕巴巴，就回去重看对应片段，别含糊带过。