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