Proxy是唯一能全面拦截对象动态操作的机制,Reflect是其拦截器中必须配合使用的默认行为实现,直接操作target会破坏属性描述符、getter/setter绑定和receiver语义。

#field)直接报错。
为什么 set/get 拦截里必须用 Reflect.set() 和 Reflect.get()
直接写 target[prop] = value 或 target[prop] 看似省事,但会绕过三类关键语义:
- 属性描述符:比如
writable: false的属性,target[prop] = value会静默失败(非严格模式)或抛错(严格模式),而Reflect.set()明确返回false,让你可控处理 - 访问器(getter/setter):直接赋值不触发 setter 内部逻辑,
this也指向target而非代理对象,导致像this._name读写错乱 -
receiver参数缺失:这是 Vue/MobX 响应式依赖收集的关键。不用Reflect.get(target, prop, receiver),继承链上的 getter 就查不到、Symbol 属性可能漏掉、私有字段直接 throw
正确写法:
const handler = {
get(target, prop, receiver) {
console.log(`GET ${prop}`);
return Reflect.get(target, prop, receiver); // ✅
},
set(target, prop, value, receiver) {
console.log(`SET ${prop} =`, value);
return Reflect.set(target, prop, value, receiver); // ✅
}
};
哪些操作只能靠 Proxy 拦截,Object.defineProperty 完全无能为力
如果你还在用 Object.defineProperty 做响应式或校验,遇到以下场景就注定失败:
- 动态新增属性:
obj.newField = 1——defineProperty对它完全没反应 - 数组索引赋值:
arr[0] = 'x'—— 数组长度变化、索引写入均无法捕获 -
in操作符:'x' in obj——defineProperty不提供对应钩子 - 删除属性:
delete obj.x—— 必须用deletePropertytrap - 枚举行为:
for...in、Object.keys()—— 需要ownKeys+getOwnPropertyDescriptor
Proxy 共支持 13 种 trap,覆盖所有基本操作;Object.defineProperty 只能监听已有属性的读写。
立即学习“Java免费学习笔记(深入)”;
如何用 Proxy + Reflect 实现一个带类型校验的只读代理
“只读”不是只拦 set 就完事。用户还能删属性、加新属性、改原型,甚至冻结对象——这些都得一并堵住:
- 必须拦截:
set、deleteProperty、defineProperty、preventExtensions、setPrototypeOf - 类型校验放在
set里,但赋值动作仍交由Reflect.set()执行,否则属性描述符(如configurable)失效 -
get中继续用Reflect.get(),确保访问器、Symbol、继承属性全部正常
示例(简化版):
function typedReadOnly(obj, schema = {}) {
return new Proxy(obj, {
set(target, key, value) {
if (schema[key] && typeof value !== schema[key]) {
throw new TypeError(`Expected ${schema[key]} for ${key}, got ${typeof value}`);
}
return Reflect.set(target, key, value);
},
deleteProperty() { throw new Error('Cannot delete property on read-only object'); },
defineProperty() { throw new Error('Cannot define property on read-only object'); },
preventExtensions() { return true; },
setPrototypeOf() { return false; }
});
}
容易被忽略的边界:Reflect 方法全都不抛异常,且返回值有明确语义
Reflect.deleteProperty(obj, 'x') 返回 true/false,不是抛错;Reflect.has(obj, 'x') 比 'x' in obj 更可靠——它不会意外触发原型上 getter 的副作用。
更关键的是:Reflect.construct() 是唯一能控制 new.target 的方式,想安全继承 Array 或 Map 必须用它;Reflect.apply(fn, thisArg, args) 比 fn.apply() 更适合在代理中做函数调用转发。
这些不是“锦上添花”,而是你在写生产级代理时,绕不开的语义细节。










