Proxy() 构造函数

Proxy() 构造函数用于创建 Proxy 对象。

语法

js
new Proxy(target, handler)

备注: Proxy() 只能通过 new 关键字来调用。如果不使用 new 关键字调用,则会抛出 TypeError

参数

target

Proxy 会对目标(target)对象进行包装。它可以是任何类型的对象,包括原生的数组、函数甚至是另一个代理对象。

handler

一个对象,其属性是定义了在对代理执行操作时的行为的函数。

描述

可以使用 Proxy() 构造函数来创建一个新的 Proxy 对象。构造函数接收两个必须的参数:

  • target 是要创建代理的对象
  • handler 是定义了代理的自定义行为的对象

一个空的处理器(handler)将会创建一个与被代理对象行为几乎完全相同的代理对象。通过在 handler 对象上定义一组函数,你可以自定义被代理对象的一些特定行为。例如,通过定义 get() 你就可以自定义被代理对象的属性访问器

处理器函数

本节列出了所有你可以自定义的处理函数。处理器函数有时候也被称为劫持(trap),这是由于它们会对底层被代理对象的调用进行劫持。

handler.apply()

函数调用劫持。

handler.construct()

new 运算符劫持。

handler.defineProperty()

Object.defineProperty 调用劫持。

handler.deleteProperty()

delete 运算符劫持。

handler.get()

获取属性值劫持。

handler.getOwnPropertyDescriptor()

Object.getOwnPropertyDescriptor 调用劫持。

handler.getPrototypeOf()

Object.getPrototypeOf 调用劫持。

handler.has()

in 运算符劫持。

handler.isExtensible()

Object.isExtensible 调用劫持。

handler.ownKeys()

Object.getOwnPropertyNamesObject.getOwnPropertySymbols 调用劫持。

handler.preventExtensions()

Object.preventExtensions 调用劫持。

handler.set()

设置属性值劫持。

handler.setPrototypeOf()

Object.setPrototypeOf 调用劫持。

示例

选择性代理属性访问器

本示例中,被代理对象有两个属性:notProxiedproxied。我们定义了一个处理器,它为 proxied 属性返回一个不同的值,而其他属性则通过目标获取。

js
const target = {
  notProxied: "原始值",
  proxied: "原始值",
};

const handler = {
  get(target, prop, receiver) {
    if (prop === "proxied") {
      return "替换值";
    }
    return Reflect.get(...arguments);
  },
};

const proxy = new Proxy(target, handler);

console.log(proxy.notProxied); // "原始值"
console.log(proxy.proxied); // "替换值"

规范

Specification
ECMAScript Language Specification
# sec-proxy-constructor

浏览器兼容性

BCD tables only load in the browser

参见