Vue 3用Proxy重构响应式系统，实现新增/删除属性、数组任意操作、原生集合类型及深层嵌套的自动响应与性能优化。
Vue 3 用 Proxy 替代 Object.defineProperty，不是简单换一个 API，而是重构了整个响应式底层逻辑——它不再逐个属性“打补丁”，而是对整个对象做“全局代理”，从而绕开了 Vue 2 所有根本性限制。
新增/删除属性自动响应
Vue 2 中动态添加属性（如 obj.newKey = 'val'）不会触发更新，必须用 Vue.set()；删除属性同理。这是因为 defineProperty 只能拦截已存在的属性。
- Vue 3 的
reactive()返回的是 Proxy 实例，对任意 key 的读写（包括不存在的 key）都会触发get/set拦截器 - 新增属性时，
set拦截器自动调用track()收集依赖，后续修改就能正确触发更新 - 删除属性（
delete obj.key）也会被deleteProperty拦截，触发依赖清理和视图更新
数组操作全面覆盖
Vue 2 对数组索引赋值（arr[0] = newVal）、length 修改、清空（arr.length = 0）均不响应，只能靠重写变异方法兜底。
- Proxy 可拦截
set、deleteProperty、length属性变更等所有操作，数组行为完全透明 -
arr[100] = 'x'、arr.length = 5、delete arr[0]全部可响应 - 无需特殊处理，也不需要额外封装数组方法
原生集合类型原生支持
Vue 2 完全无法响应 Map、Set、WeakMap 等结构，开发者只能退化为普通对象模拟。
立即学习“前端免费学习笔记（深入）”；
- Proxy 天然支持对
Map、Set的get、set、has、delete、clear等全部操作拦截 -
reactive(new Map([['a', 1]]))可直接使用，增删查改均触发更新 - 甚至支持
class实例、FileList等复杂对象的响应式包装
初始化性能与深层嵌套更可控
Vue 2 初始化时需递归遍历整个 data 树，每个属性都调用 defineProperty，大对象或深嵌套会明显卡顿。
- Proxy 是懒代理：只有真正访问某个属性时，才触发
get并进行依赖收集 - 未读取的深层属性不会提前劫持，内存和初始化开销大幅降低
- 配合
shallowRef和shallowReactive，可精确控制响应深度，避免无谓代理
