当前位置：首页 > news >正文

ES6中Proxy和Proxy实例

news 2025/7/22 0:38:09

1.Proxy
Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器”
使用方法

let p = new Proxy(target, handler);

其中，target 为被代理对象。handler 是一个对象，其声明了代理 target 的一些操作。p 是代理后的对象。

当外界每次对 p 进行操作时，就会执行 handler 对象上的一些方法。

let target = {name: 'obj'};letlogHandler = {get: function(target, key) {console.log(`${key} 被读取`);return target[key];},set: function(target, key, value) {console.log(`${key} 被设置为 ${value}`);target[key] = value;}}lettargetWithLog = new Proxy(target, logHandler);targetWithLog.name; // 控制台输出：name 被读取targetWithLog.name = 'others'; // 控制台输出：name 被设置为 others
console.log(target.name); // 控制台输出: others

2.proxy实例

重点说一下其construct方法

—构造函数拦截 – construct()

construct方法用于拦截proxy实例new命令，下面是拦截对象的写法。

var handler = {construct (target, args, newTarget) {return new target(...args);}
};

其中construct方法可以接受三个参数。

target：目标对象
args：构造函数的参数对象
construct方法返回的必须是一个对象，否则会报错。
newTarget：创造实例对象时，new命令作用的构造函数

var p = new Proxy(function() {}, {construct: function(target, argumentsList) {return 1;}
});new p() // 报错
// Uncaught TypeError: 'construct' on proxy: trap returned non-object ('1')

var p = new Proxy(function() {}, {construct: function(target, args) {conosole.log('called:'+ args.join(','));return { value：args[0]*10);}
});(new p(1)).value  // new p的时候会执行construct方法
// 'called:1'
// 10