proxy与Reflect吃透

本文探讨了Proxy与Reflect的关系,指出它们在API上的相似性与区别,并着重讲解了Proxy中apply和construct两个难点。通过示例解析了Proxy如何在函数调用和构造函数中起到拦截作用。此外,还介绍了如何利用Proxy实现观察者模式,以实现对象间的联动效果。
摘要由CSDN通过智能技术生成

缘起


最近看好多童鞋私下问我这方面的问题,正好有点时间,小编写了篇文章科普下!

proxy与Reflect关系


相通点: api相通,经常混合使用
不同点:proxy可以看做是代理,中间件,Reflect是操作对象提供的api,可以看做是Object的升级版,增加兼容性,对浏览器和用户友好!

proxy中较难的点


proxy具体大家可以看文档,较难的点其实就是如何代理函数,下面大家花点时间认真阅读。

这里我们看2个API

  • apply
  • construct

apply是调用拦截,简单来说就是调用的时候拦截
示例1:

var target = function () { return 'target'; };
var handler = {
  apply: function () {
    return 'proxy';
  }
};

var p = new Proxy(target, handler);

p()  // "proxy"

示例2:

var handler = {
  apply (target, ctx, args) {
  console.log(args)
    return Reflect.apply(...arguments);
  }
};
var target = function () { return 'target'; }
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值