proxy 本身不直接实现脏检查,但通过拦截属性读写操作记录变更字段,支持标记法(set记录key)、依赖收集(get中追踪)和快照对比(初始值vs当前值)三种实现方式。

Proxy 本身不直接实现脏检查,但它能为脏检查提供底层支持——通过拦截对象属性的读写操作,记录哪些字段被访问或修改,从而在合适时机对比前后状态差异。
用 Proxy 拦截 set 操作标记“已修改”
脏检查的核心是知道“什么变了”。最常用的方式是在每次赋值时打标记:
- 创建一个 Set 或 Map 记录被修改过的 key(如
new Set(['name', 'age'])) - 在 Proxy 的
settrap 中,把 key 加入该集合,并返回 true 表示设置成功 - 后续调用
isDirty()方法时,只需判断该集合是否非空即可快速得知是否有变更
结合 get 拦截实现依赖收集(可选进阶)
如果需要更精细的脏检查(比如只关心某几个字段),可以在 get 中记录当前正在读取哪些属性(用于后续比对范围):
FastAPI + Flask 混合部署最佳实践,解决路由定义、API 代理等常见问题,适用于同时运行 FastAPI API 与 Flask 前端的场景。
- 维护一个临时的 “访问路径栈” 或 “当前依赖列表”,在 get 时 push key
- 当触发校验逻辑(如提交前),只比对这些被读过、且又被 set 过的字段
- 注意:这类似响应式框架的依赖追踪思路,但脏检查通常不需要实时更新,所以可简化为一次性的“读-改-判”流程
手动触发比对:保存快照 + 对比变更
真正意义上的脏检查往往需要两个状态快照(初始值 vs 当前值):
- 初始化时用
JSON.parse(JSON.stringify(obj))或结构化克隆(structuredClone)保存原始副本 - Proxy 的 set 拦截中不仅记 key,还可同步更新一个变更副本(或延迟到校验时再深比较)
- 校验函数遍历所有被标记的 key,逐个比较原始值与当前值(注意处理引用类型、NaN、undefined 等边界)
实际使用建议
Proxy 脏检查适合轻量、可控场景(如表单模型),不推荐替代 Vue/React 的响应式系统:
- 避免代理整个大对象,优先代理业务数据子树(如
proxy = new Proxy(formData, handler)) - set 拦截里不要做重操作(如深克隆、复杂 diff),只做标记;比对逻辑单独封装
- 注意 Proxy 不会代理原型链上的属性,也不响应数组索引赋值(
arr[0] = x)或length变更,必要时需额外处理 - 若需兼容 IE,Proxy 不可用,得降级为 Object.defineProperty + 手动 setter 调用
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










