JavaScript代理对象是什么？Proxy拦截哪些操作？

最近发现不少小伙伴都对文章很感兴趣，所以今天继续给大家介绍文章相关的知识，本文《JavaScript 代理对象是什么？Proxy 拦截哪些操作？》主要内容涉及到等等知识点，希望能帮到你！当然如果阅读本文时存在不同想法，可以在评论中表达，但是请勿使用过激的措辞~

Proxy是拦截并自定义对象基本操作的包装器，不修改原对象，通过handler中的get、set、has、deleteProperty、ownKeys、apply、construct等trap实现响应式、校验、日志等功能，但仅浅代理且部分内置行为不可拦截。

JavaScript 代理对象（Proxy）是一个包装器，用来拦截并自定义对另一个对象的基本操作行为。 它不改变原对象本身，而是提供一层“中间层”，让开发者能监听、改写甚至阻止对目标对象的访问或修改。核心用途是实现响应式系统、数据校验、日志记录、权限控制等高级逻辑。

Proxy 能拦截哪些操作？

Proxy 通过 handler 对象定义一系列捕获器（traps），每个对应一种对象操作。常见且高频使用的包括：

• get(target, prop, receiver)：读取属性时触发，比如 obj.x 或 obj['x']。可用于实现默认值、链式调用、响应式依赖收集。
• set(target, prop, value, receiver)：设置属性时触发，如 obj.x = 123。适合做数据校验、变更通知、不可变约束。
• has(target, prop)：用于 in 操作符，比如 'x' in obj。可隐藏某些属性，模拟稀疏数组或权限过滤。
• deleteProperty(target, prop)：对应 delete obj.x。能阻止删除、记录删除行为或触发清理逻辑。
• ownKeys(target)：影响 Object.keys()、for...in、Reflect.ownKeys() 等枚举行为。可控制哪些属性被列出，常用于代理 Symbol 属性或私有字段。
• apply(target, thisArg, argumentsList)：仅对函数对象有效，在函数被调用时触发，比如 fn()。可用于装饰器、参数预处理、调用日志。
• construct(target, argumentsList, newTarget)：拦截 new 操作，适用于封装构造函数、强制继承、实例监控等场景。

不是所有操作都能被 Proxy 拦截

Proxy 是“浅代理”——它只拦截直接作用于代理对象的操作，不递归代理嵌套对象。例如：

• 对 proxy.a.b = 1，get 拦截会先触发获取 a，但如果 a 是普通对象而非另一个 Proxy，后续对 b 的赋值就不会再走 set。
• 原型链上的属性访问（如未在自身定义的属性）仍走正常原型查找，除非显式在 get 中处理 receiver 和原型委托。
• 部分内置行为无法拦截，比如 Object.prototype.toString.call(proxy) 仍返回 [object Object]，不会触发 get；但可通过 toStringTag Symbol 微调。

一个最小可用示例

下面代码创建一个带日志的代理，每次读写都打印信息：

const target = { x: 1 };
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.x;        // 输出：读取 x
proxy.y = 42;    // 输出：设置 y = 42

基本上就这些。Proxy 不复杂但容易忽略细节，比如必须显式返回值、注意 receiver 参数、避免无限递归（在 handler 里操作 target 要小心）。掌握常用 traps 就能覆盖大多数元编程需求。

终于介绍完啦！小伙伴们，这篇关于《JavaScript代理对象是什么？Proxy拦截哪些操作？》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！