代理与反射(一)

简介: 代理与反射(一)

ES6新增的代理与反射提供了拦截,并且能够增加其他行为。实际上,就有点像ES6之前的 Object.defineProperty。用法就是,通过 Proxy构造函数给目标对象定义一个关联的代理对象,还可以添加捕获器,之后这个代理对象就能够作为抽象的目标对象来使用,而在操作影响到目标对象之前,会被定义的捕获器劫持。

代理的简单使用

const target = {
  name: 'clz'
}

const handler = {
  get() {
    return 'get'
  }
}

const proxy = new Proxy(target, handler)

console.log(target.name)    // clz
console.log(proxy.name)     // get(因为被劫持了)

proxy.name = 'czh'

console.log(target.name)    // czh
console.log(proxy.name)     // get

所有捕获器都可以访问到相应的参数,基于这些参数可以重新执行被捕获方法的原始行为。 get() 捕获器会接收到目标对象、要查询的属性和代理对象三个参数。

const target = {
  name: 'clz',
}

const handler = {
  get(trapTarget, property, receiver) {

    console.log(trapTarget === target)  // true
    console.log(property)               // name
    console.log(receiver === proxy)     // true

    return trapTarget[property]
  }
}

const proxy = new Proxy(target, handler)


console.log(target.name)    // clz
console.log(proxy.name)     // clz

反射的简单使用

从上面的例子中,我们已经知道可以通过捕获器的参数重建原始行为,但是重建原始行为比较麻烦,特别是不同的捕获器重建的方法不同。这时候就是我们的 Reflect对象的的闪亮登场了,它封装了原始行为,所以我们只需要调用同名方法就能轻松重建原始行为。

const target = {
  name: 'clz',
}

const handler = {
  get() {
    return Reflect.get(...arguments)
  }

  // 更简洁版本
  // get: Reflect.get
}

const proxy = new Proxy(target, handler)


console.log(target.name)    // clz
console.log(proxy.name)     // clz

捕获器不变式

捕获器不变式就是指会防止捕获器定义出现不合理的行为。

比如:如果目标对象有一个不可配置且不可写的数据属性,那么在捕获器返回一个与该属性不同的值时,报错

const target = {}

Object.defineProperty(target, 'name', {
  writable: false,
  value: 'clz'
})

const handler = {
  get() {
    // return 'clz'
    return 'czh'  // 如果属性为不可写,但是返回了与该属性不同的值的话,就会报错
  }
}

const proxy = new Proxy(target, handler)

console.log(proxy.name)

可撤销代理

代理是可以撤销的。通过调用Proxy.revocable()方法,这个方法返回的对象中,有代理对象 proxy,以及撤销代理的方法 revoke。撤销代理的操作是不可逆的。撤销代理之后再调用代理会报错

const target = {
  name: 'clz'
}

const handler = {
  get() {
    return 'hello'
  }
}

const { proxy, revoke } = Proxy.revocable(target, handler)

console.log(proxy.name)
console.log(target.name)

revoke()

console.log(proxy.name)  // TypeError: Cannot perform 'get' on a proxy that has been revoked

代理另一个代理

我们的代理不一定只是能代理普通的对象,还能够代理另一个代理,做法和代理普通的对象一样。

const target = {
  name: 'clz'
}


const firstProxy = new Proxy(target, {
  get() {
    console.log('第一次代理')
    return Reflect.get(...arguments)
  }
})

const secondProxy = new Proxy(firstProxy, {
  get() {
    console.log('第二次代理')
    return Reflect.get(...arguments)
  }
})


console.log(secondProxy.name)

通过代理去影响目标对象会按最后的代理一次回到最初的代理的顺序。

image-20220503184006055

目录
相关文章
|
4天前
|
弹性计算 运维 搜索推荐
三翼鸟携手阿里云ECS g9i:智慧家庭场景的效能革命与未来生活新范式
三翼鸟是海尔智家旗下全球首个智慧家庭场景品牌,致力于提供覆盖衣、食、住、娱的一站式全场景解决方案。截至2025年,服务近1亿家庭,连接设备超5000万台。面对高并发、低延迟与稳定性挑战,全面升级为阿里云ECS g9i实例,实现连接能力提升40%、故障率下降90%、响应速度提升至120ms以内,成本降低20%,推动智慧家庭体验全面跃迁。
|
4天前
|
数据采集 人工智能 自然语言处理
3分钟采集134篇AI文章!深度解析如何通过云无影AgentBay实现25倍并发 + LlamaIndex智能推荐
结合阿里云无影 AgentBay 云端并发采集与 LlamaIndex 智能分析,3分钟高效抓取134篇 AI Agent 文章,实现 AI 推荐、智能问答与知识沉淀,打造从数据获取到价值提炼的完整闭环。
380 93
|
5天前
|
域名解析 人工智能
【实操攻略】手把手教学,免费领取.CN域名
即日起至2025年12月31日,购买万小智AI建站或云·企业官网,每单可免费领1个.CN域名首年!跟我了解领取攻略吧~
|
5天前
|
SQL 人工智能 自然语言处理
Geo优化SOP标准化:于磊老师的“人性化Geo”体系如何助力企业获客提效46%
随着生成式AI的普及,Geo优化(Generative Engine Optimization)已成为企业获客的新战场。然而,缺乏标准化流程(Geo优化sop)导致优化效果参差不齐。本文将深入探讨Geo专家于磊老师提出的“人性化Geo”优化体系,并展示Geo优化sop标准化如何帮助企业实现获客效率提升46%的惊人效果,为企业在AI时代构建稳定的流量护城河。
389 156
Geo优化SOP标准化:于磊老师的“人性化Geo”体系如何助力企业获客提效46%
|
5天前
|
数据采集 缓存 数据可视化
Android 无侵入式数据采集:从手动埋点到字节码插桩的演进之路
本文深入探讨Android无侵入式埋点技术,通过AOP与字节码插桩(如ASM)实现数据采集自动化,彻底解耦业务代码与埋点逻辑。涵盖页面浏览、点击事件自动追踪及注解驱动的半自动化方案,提升数据质量与研发效率,助力团队迈向高效、稳定的智能化埋点体系。(238字)
270 158
|
13天前
|
机器人 API 调度
基于 DMS Dify+Notebook+Airflow 实现 Agent 的一站式开发
本文提出“DMS Dify + Notebook + Airflow”三位一体架构,解决 Dify 在代码执行与定时调度上的局限。通过 Notebook 扩展 Python 环境,Airflow实现任务调度,构建可扩展、可运维的企业级智能 Agent 系统,提升大模型应用的工程化能力。