原型式继承通过object.create构建不可变快照链实现轻量状态演化:新对象仅存储变更字段,未改字段由原型链继承;支持按需浅合并、版本回溯及weakmap元数据绑定,适用于表单草稿等低频静态场景。

原型式继承本身不提供状态管理能力,但它能支撑起极简、低开销的状态演化机制——核心是用 Object.create 构建不可变快照链,避免深拷贝和冗余数据复制。
用 Object.create 做只读快照
每次状态变更不修改原对象,而是以当前状态为原型创建新对象:
- 原理清晰:新对象自身为空,所有属性写入都落在实例上;原型链保持只读,历史版本不会被意外覆盖
-
操作简单:比如初始状态
const base = { theme: 'light', lang: 'zh' },切换主题时只需const next = Object.create(base); next.theme = 'dark' -
内存友好:只有变化字段占用新内存,未改动的字段(如
lang)仍由原型链自然继承
让状态链支持按需合并与回溯
访问某个版本时,可沿原型链自动获取“默认值”;需要完整快照时再做浅合并:
- 直接读取
next.lang会返回'zh'(从base继承),无需手动 fallback - 调用
Object.assign({}, next)可生成当前视角下的完整状态对象(注意:引用类型仍共享,如嵌套对象不自动深拷贝) - 若需回滚到前一版,直接持有对
base的引用即可,无需额外索引或版本号
配合 WeakMap 管理元信息
当需要附加时间戳、提交人、变更说明等元数据,又不想污染状态对象本身,可用 WeakMap 关联:
const meta = new WeakMap(); meta.set(next, { at: Date.now(), by: 'user-123' })-
WeakMap不阻止垃圾回收,适合临时绑定元信息,避免内存泄漏 - 适用于表单草稿、配置快照、AI生成内容的多轮迭代等轻量场景
注意边界:它不是 React 或 Vue 的替代品
这种模式适用于局部、静态、低频更新的状态(如 UI 配置、表单中间态、离线缓存版本),不适合高频响应式更新:
- 没有自动触发视图重绘,需配合手动
setState或响应式系统使用 - 不处理异步副作用、中间件、订阅通知等复杂逻辑,属于“状态容器 + 原型委托”的组合方案
- 真正要集成进组件体系,建议作为底层状态结构,外层再套一层 Hook 或响应式包装











