Proxy 是用于拦截并自定义对象基本操作的构造器，通过 target 和 handler 创建代理对象，支持 get、set 等陷阱方法，比 Object.defineProperty 更全面、不污染原对象且能动态拦截新增属性。
Proxy 是 JavaScript 中用于拦截并自定义对象基本操作的构造器，它允许你创建一个代理对象来包装目标对象，并在访问、修改、删除等行为发生时插入自定义逻辑。 它不是给对象加属性或改原型，而是“站在对象前面”，把所有对它的操作先过一遍你的控制函数。
Proxy 的基本结构：target + handler
创建 Proxy 需要两个参数：
- target：要被代理的原始对象（可以是普通对象、数组、函数，甚至 null 以外的任意值）
-
handler：一个配置对象，里面定义各种“陷阱”（trap），比如
get、set、has、deleteProperty等
示例：拦截读取和赋值
const target = { count: 0 };
const proxy = new Proxy(target, {
get(obj, prop) {
console.log(`读取 ${prop}`);
return obj[prop];
},
set(obj, prop, value) {
console.log(`设置 ${prop} = ${value}`);
obj[prop] = value;
return true; // 必须返回 true 表示赋值成功
}
});
proxy.count; // 输出：读取 count → 0
proxy.count = 5; // 输出：设置 count = 5 → 赋值生效
常用拦截方法（trap）及典型用途
不是所有操作都默认拦截，只有你在 handler 里显式定义了对应 trap，才会生效。常见且实用的有：
立即学习“Java免费学习笔记（深入）”；
- get：拦截属性读取，可用于日志、默认值、响应式依赖收集
- set：拦截属性赋值，适合数据校验、自动触发更新、只读限制
-
has：拦截
in操作符，可隐藏属性或模拟稀疏数组 -
ownKeys：拦截
Object.keys()、for...in等，控制哪些键可见 - defineProperty / deleteProperty：控制属性定义与删除行为
注意：set 必须显式返回 true 才算赋值成功，否则会抛出 TypeError（严格模式下）。
Proxy 和 Object.defineProperty 的关键区别
两者都能做属性拦截，但 Proxy 更强大、更彻底：
- 作用范围不同：defineProperty 只能监听已存在的属性，新增属性需重新定义；Proxy 一次性代理整个对象，对后续动态添加的属性也自动生效
-
能力覆盖更广：defineProperty 无法拦截
in、delete、for...in、Object.keys等操作；Proxy 全部支持 - 不污染原对象：Proxy 返回的是新对象（代理），原对象完全不受影响；defineProperty 是直接改原对象的属性描述符
- 性能考虑：Proxy 有一定运行时开销，高频场景（如大量循环）需谨慎；defineProperty 在初始化阶段有成本，但运行时更快
一个实用小例子：带类型检查的响应式对象
用 Proxy 实现一个简单但可用的“赋值即校验”对象：
function createTypedProxy(obj, validators = {}) {
return new Proxy(obj, {
set(target, key, value) {
const validator = validators[key];
if (validator && !validator(value)) {
throw new Error(`Invalid value for ${key}: ${value}`);
}
target[key] = value;
console.log(`${key} updated to`, value);
return true;
}
});
}
const user = createTypedProxy(
{ name: 'Alice', age: 30 },
{
age: v => typeof v === 'number' && v > 0 && v < 150,
name: v => typeof v === 'string' && v.trim().length > 0
}
);
user.age = 25; // ✅ 正常
user.age = -5; // ❌ 报错：Invalid value for age
