proxy是es6用于创建代理对象、拦截并自定义对象基本操作的构造器,通过new proxy(target, handler)实现,handler中trap方法(如get/set/apply等)可精细控制读取、赋值、函数调用等行为,不修改原对象,支持数组、嵌套对象等深层代理。

ES6 的 Proxy 是一个用于创建对象代理、拦截并自定义基本操作(如读取、赋值、枚举、函数调用等)的构造器。它不修改原对象,而是在原对象和外界之间加一层“拦截层”,让开发者能精细控制对象行为。
Proxy 基本结构与 handler 拦截器
创建 Proxy 需要两个参数:目标对象(target)和处理器对象(handler)。handler 是一个配置对象,其属性(称为 trap)对应各种可拦截的操作。
常见 trap 包括:
-
get(target, prop, receiver):拦截读取属性,比如
obj.x或obj['x'] -
set(target, prop, value, receiver):拦截设置属性,比如
obj.x = 1 -
has(target, prop):拦截
prop in obj -
deleteProperty(target, prop):拦截
delete obj.x -
ownKeys(target):拦截
Object.getOwnPropertyNames()、for...in等枚举操作 - apply(target, thisArg, argumentsList):拦截函数调用(当 target 是函数时)
实现响应式数据代理(简易 Vue/React 响应式原理)
Proxy 可替代 Object.defineProperty 实现更彻底的数据劫持——支持数组索引、新增/删除属性、Map/Set 等原生结构(需额外封装)。
macOS 微信消息自动化工具。通过 GUI 自动化实现:发送消息给指定联系人、读取聊天内容、监控新消息。适用于需要自动化微信操作的场景,如定时发送、批量回复、消息备份等。依赖 peekaboo 进行屏幕截图和 UI 交互。仅支持 macOS。开源地址:https://github.com/chairmanmia...
示例:监听对象属性读写,自动触发更新逻辑:
const data = { count: 0, name: 'Alice' };
const handlers = {
get(target, prop) {
console.log(`读取 ${prop}:`, target[prop]);
return target[prop];
},
set(target, prop, value) {
console.log(`设置 ${prop} =`, value);
target[prop] = value;
updateView(); // 触发视图更新
return true;
}
};
const proxy = new Proxy(data, handlers);
proxy.count++; // 输出:读取 count → 设置 count = 1 → 触发 updateView
拦截数组方法与深层代理
Proxy 默认只代理第一层。若需响应式嵌套对象,需在 get 中递归代理:
function reactive(obj) {
if (typeof obj !== 'object' || obj === null) return obj;
return new Proxy(obj, {
get(target, prop, receiver) {
const res = Reflect.get(target, prop, receiver);
// 对象/数组属性自动转为 reactive
if (typeof res === 'object' && res !== null) {
return reactive(res);
}
return res;
},
set(target, prop, value, receiver) {
const oldVal = target[prop];
const result = Reflect.set(target, prop, value, receiver);
if (oldVal !== value) updateView();
return result;
}
});
}
注意:push、pop 等数组方法会触发 set(如修改 length)或 get(如读取 length),因此也能被拦截,无需单独重写数组原型方法。
实用技巧与注意事项
使用 Proxy 时要注意几点关键细节:
- 所有操作推荐用 Reflect API(如
Reflect.get)代替直接访问,确保语义一致且便于 fallback - Proxy 无法代理 undefined、null、原始值(如字符串字面量),只能代理对象
- 被代理对象的
this在方法中仍指向原对象,如需绑定代理实例,可用bind(proxy)或在apply中处理 - Proxy 实例与原对象不相等(
proxy !== target),且无法通过instanceof判断原类型(可配合getPrototypeOftrap 修复)
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










