标准答案
- 用一个 store 保存内部 state。
- 提供 getState 读取当前状态。
- 提供 setState 或 dispatch 作为唯一更新入口。
- 提供 subscribe 注册监听函数，并返回 unsubscribe 取消订阅。
- 复杂版本再加入 action、reducer、中间件、派生状态、持久化和模块拆分。
题目解析
状态管理库解决的不是“把变量放到全局”这么简单，而是让跨组件共享状态有明确读取、更新和通知机制。否则状态来源会分散，谁改了数据、为什么更新都很难追踪。
最小模型可以像 Redux store：getState 读，dispatch 改，subscribe 听。也可以像轻量 store：setState 合并局部状态后通知监听器。
真实项目里还要区分哪些状态应该进全局。服务端缓存、表单临时输入、URL 参数、组件局部 UI 状态都不一定适合放到同一个全局 store。
代码示例
简化版 store 展示读取、更新、订阅和取消订阅四个能力。
JavaScript
function createStore(initialState) {
let state = initialState
const listeners = new Set()
return {
getState() {
return state
},
setState(partial) {
state = { ...state, ...partial }
listeners.forEach((listener) => listener(state))
},
subscribe(listener) {
listeners.add(listener)
return () => listeners.delete(listener)
}
}
}常见误区
- 把所有页面状态都塞进全局 store，导致状态边界失控。
- 允许任意地方直接改内部 state，订阅者无法可靠收到通知。
- 没有 unsubscribe，组件卸载后仍然持有监听函数，造成内存泄漏。