Proxy 劫持构造函数实现无侵入监控

本文深入解析了如何利用 Proxy 的 construct 和 apply 陷阱实现对 JavaScript 实例化行为的无侵入式监控，强调关键细节：construct 仅对真正可构造的函数生效，必须严格使用三参数 Reflect.construct 以避免原型链断裂和 instanceof 失效；而面对日益主流的工厂函数（如 zustand.create、axios.create），则需转向 apply 陷阱进行拦截——因为它们才是现代前端中实际承担“实例创建”职责的隐性入口；文章不仅揭示了常见错误（如误用 target(...)、漏传 newTarget、混淆构造与调用语义），更指出监控成败的核心不在于 Proxy 语法本身，而在于精准识别并切入那些文档未明示、类型难推断、甚至动态生成的构造源头。

直接 new Proxy(Class, { construct }) 会报错？

会，而且非常典型。错误信息通常是 TypeError: Class constructor XXX cannot be invoked without 'new' 或 Cannot call a class as a function。这是因为 Proxy 的 construct 陷阱只在代理对象被 new 调用时触发，但前提是目标必须是**可构造函数**（即本身支持 new），而很多第三方类库（如 axios.create 返回的实例工厂、Lodash 的 _.throttle 等）根本不是 class，而是普通函数或对象。

更关键的是：即使目标是 class，construct 陷阱里若没正确调用 Reflect.construct(target, args, newTarget)，或者漏传 newTarget（即代理构造器本身），就会破坏原型链，导致实例 instanceof 判断失败、方法丢失。

• 不要写 target(...args) —— 这是函数调用，不是构造调用
• 不要省略第三个参数 newTarget，否则子类继承链断裂
• 如果目标 class 有私有字段（#field）或私有方法，construct 无法绕过访问限制，代理实例仍会报错

真正能拦截“实例化”的只有两种可靠路径

所谓“拦截第三方类库实例化”，本质是拦截它暴露出来的**构造入口**，而不是魔法般监听所有 new 行为。浏览器和 JS 引擎不提供全局实例化钩子。

常见可行入口：

• new Map()、new Set()、new Date() 等原生构造器：可用 Object.defineProperty 覆盖，再在新函数中调用 Reflect.construct 并注入逻辑
• 第三方库导出的 class（如 class Chart extends EventEmitter）：必须拿到其原始引用，再用 new Proxy(Chart, { construct }) 包一层，并确保 construct 中调用 Reflect.construct(target, args, newTarget)
• 工厂函数（如 axios.create(config)、new Worker(...)）：它们不是 class，但行为等价于构造；应代理该函数本身，用 apply 陷阱拦截，而非 construct

注意：CDN 引入的全局类（如 window.Chart）比 ESM 模块更容易代理，因后者常被 tree-shaking 或编译器转译干扰引用链。

construct 陷阱里必须用 Reflect.construct，且传全三个参数

这是最容易被跳过的细节。漏掉 newTarget 会导致代理构造器创建的实例，其 constructor 指向原始 class，而非代理本身，后续对实例的 Proxy 增强（如属性监控）会失效。

const OriginalChart = window.Chart;
window.Chart = new Proxy(OriginalChart, {
  construct(target, args, newTarget) {
    console.log('[construct]', 'Chart instantiated with', args);
    // ✅ 正确：三参数齐全，保持原型链完整
    const instance = Reflect.construct(target, args, newTarget);
    // 可在此对 instance 做增强，如添加 _createdAt 字段
    instance._createdAt = Date.now();
    return instance;
  }
});

• target 是原始构造函数
• args 是传给 new Chart(...) 的参数数组
• newTarget 是当前 Proxy 构造器（即 window.Chart），必须显式传入
• 不要在 construct 中返回裸对象（{}），否则 instanceof 全部失效

工厂函数比 class 更值得优先拦截

现代前端库越来越倾向用工厂函数替代 class 导出（比如 zustand.create、valtio.proxy、swr.useSWR 的内部实例化逻辑）。它们不依赖 new，但实际承担了“创建新状态/实例”的职责。

这类函数应使用 apply 陷阱，而非 construct：

const originalCreateStore = zustand.create;
zustand.create = new Proxy(originalCreateStore, {
  apply(target, thisArg, args) {
    console.log('[zustand.create]', 'called with', args.length, 'arguments');
    const store = Reflect.apply(target, thisArg, args);
    // 对 store 对象做属性级监控（用另一个 Proxy）
    return new Proxy(store, { get: /* ... */ });
  }
});

• 工厂函数无 new 语义，construct 根本不会触发
• apply 能捕获所有调用场景（包括解构赋值、箭头函数内调用等）
• 返回值可以是任意类型（对象、函数、Promise），灵活性远超 construct

真正难的从来不是“怎么写 Proxy”，而是判断哪个函数才是你真正想监控的实例化源头——它往往藏在文档不提、类型定义模糊、甚至运行时动态生成的代码里。

终于介绍完啦！小伙伴们，这篇关于《Proxy 劫持构造函数实现无侵入监控》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！