ES6中Proxy和Proxy实例

31 篇文章 1 订阅

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
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值