理解V3中的proxy和reflect

news2024/11/17 7:50:56

现有如下面试题

结合GeexCode和Gpt

// 这个函数名为onWatch,接受三个参数obj、setBind和getlogger。
// obj是需要进行监视的对象。
// setBind是一个回调函数,用于在设置属性时进行绑定操作。
// getlogger是一个回调函数,用于在获取属性时进行记录操作。

// 在这个函数中,使用了Reflect.get和Reflect.set来间接地访问和修改目标对象的属性
let onWatch= (obj,setBind, getlogger) =>{
    let handler = {
        get(target,property,receiver){
            getlogger(target,property)
            return Reflect.get(target,property,receiver)
            // Reflect.get(target, property, receiver)方法用于获取目标对象中指定属性的值。
            // 它类似于直接使用点运算符或方括号运算符来获取属性的值。
            // 但使用Reflect.get方法可以更加灵活,因为可以使用receiver参数来指定访问属性时的上下文对象。
        },
        set(target,property,value,receiver){
            setBind(value,property)
            return Reflect.set(target,property,value,receiver)
            // Reflect.set(target, property, value, receiver)方法用于设置目标对象中指定属性的值。
            // 它类似于直接使用点运算符或方括号运算符来设置属性的值。
            // 但使用Reflect.set方法可以更加灵活,因为可以使用receiver参数来指定设置属性时的上下文对象。
        }
    }
    return new Proxy(obj,handler)
}
// 创建需要监视的对象
let user = {
    name: "John",
    age: 30
  }
  // setBind 回调函数,在属性设置时绑定操作
  function setBind(value, property) {
    console.log(`Setting value ${value} to property ${property}`);
  }
  // getlogger 回调函数,在属性获取时记录操作
  function getlogger(target, property) {
    console.log(`Getting value ${target[property]} from property ${property}`);
  }
  // 使用 onWatch 函数创建代理对象
  let watchedUser = onWatch(user, setBind, getlogger);
  // 设置代理对象的 name 属性
  watchedUser.name = "Jane";  // 输出:Setting value Jane to property name
  // 获取代理对象的 age 属性
  console.log(watchedUser.age);  // 输出:Getting value 30 from property age
//   这个示例展示了如何使用onWatch函数来创建一个代理对象,对代理对象的属性进行监视操作。
//   在设置属性时,会触发setBind回调函数,而在获取属性时,会触发getlogger回调函数,并输出对应的信息。

// 在这个代码中,使用Reflect.get和Reflect.set来代理目标对象的属性的获取和修改操作。
// 在get处理程序中,首先调用了getlogger函数来记录目标对象的属性的获取操作,然后使用Reflect.get获取属性的值并返回。
// 在set处理程序中,首先调用了setBind函数来记录设置的属性和值,然后使用Reflect.set设置属性的值。
// 这样做的好处是可以在访问和修改属性的同时执行相应的操作,而不是直接访问和修改属性。这样可以更好地控制和处理属性的访问和修改行为。

运行如下

get,set,运行能看懂但是reflect,proxy,target, property, value, receiver看不懂,有时间看下源码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1140144.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

U盘安装Windows10系统(最新最详细图文教程)

目录 一.简介 二.安装步骤 2.1、用U盘制作PE系统 2.2 安装系统 软件:Windows 10版本:1909语言:简体中文大小:4.95G安装环境:PE系统,7代以上处理器硬件要求:CPU2.0GHz 内存4G(或更高&#xf…

Linux C语言开发(续)

一、二维数组的定义和存储 一、二维数组的定义 1、二维数组的应用:图、方阵 2、数组元素的存放顺序:内存是一维的,二维数组:按行优先 a[1]:表示第一行,也表示a[1][]的所有元素 二、二维数组的初始化、遍历 1、元素的…

吐血整理,服务端性能测试-Docker部署MySQL/Nginx(详细步骤)

目录:导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜) 前言 基于Docker部署My…

【CIKM 2023】扩散模型加速采样算法OLSS,大幅提升模型推理速度

近日,阿里云人工智能平台 PAI与华东师范大学陈岑副教授团队合作在深度学习顶级会议 CIKM 2023 上发表 OLSS (Optimal Linear Subspace Search) 算法,这是一种针对扩散模型的采样加速算法。在这篇论文中,扩散模型加速算法的本质被建模成线性子…

【软件安装环境配置】vscode 安装界面没有出现安装路径的选择 的解决,以及vscode的删除的问题

由于vscode 没有删除干净,就会出现vscode 安装的时候,没有出现安装路径的界面,所以可以来到vscode的安装路径,点击 unins000.exe 文件就可以 实现将vscode 相关的文件删除, 如果是删除了整个vscode 安装下的文件&…

Python 算法高级篇:跳跃表和布隆过滤器的应用

Python 算法高级篇:跳跃表和布隆过滤器的应用 引言 1. 跳跃表( Skip List )1.1 跳跃表的基本结构1.2 跳跃表的操作1.3 Python 中的跳跃表实现 2. 布隆过滤器( Bloom Filter )2.1 布隆过滤器的基本结构2.2 布隆过滤器的…

看懂分布式追踪系统原理及实践

前言 在微服务架构中,一次请求往往涉及到多个模块,多个中间件,多台机器的相互协作才能完成。这一系列调用请求中,有些是串行的,有些是并行的,那么如何确定这个请求背后调用了哪些应用,哪些模块,哪些节点及调用的先后顺序?如何定位每个模块的性能问题?本文将为你揭晓…

2023年集成电路还缺人吗?集成电路产业人才供需研讨会

10月20日,移知教育创始人团长受邀参与由ARM举办的《集成电路产业人才供需研讨会》,同样受邀参与的还有上海大学、华东理工大学、华东师范大学、上海工程技术大学、上海人社高级职称评审专家等等,高校负责人以及行业专家应邀参加了本次研讨会。…

JVM工具使用(jstack + jstat + jmap)

jstack: jstack是java虚拟机自带的一种堆栈跟踪工具 命令格式: jstack [-l] pid (pid 可以使用jps查看) 例:jstack 44076 &>$(date %H%M)_44076.jstack.log 线程状态: NEW,未启动的。…

LIO-SAM算法解析

文章目录 简介算法概述1.点云去畸变1.1 主要功能1.2 主要流程 2.特征提取3.IMU预积分4.地图优化5.算法评估 简介 LIO-SAM在lego-loam的基础上新增了对IMU和GPS的紧耦合,采用一个因子图对位姿进行优化,包括IMU因子,激光里程计因子&#xff0c…

企业如何选择设备管理系统?

1、需求为王,列出你的需求清单 每个企业的设备都不尽相同,自然对设备管理系统的需求也不一样。因此,需要充分明确自己的需求和目标,清晰地列出需求清单,然后再逐一对照供应商的产品功能,看是否满足自身各业…

leetCode 76. 最小覆盖子串 + 滑动窗口 + 图解(详细)

76. 最小覆盖子串 - 力扣(LeetCode) 给你一个字符串 s 、一个字符串 t 。返回 s 中涵盖 t 所有字符的最小子串。如果 s 中不存在涵盖 t 所有字符的子串,则返回空字符串 "" 注意: 对于 t 中重复字符,我们寻…

【AICFD案例操作】潜艇阻力AI预测分析

AICFD是由天洑软件自主研发的通用智能热流体仿真软件,用于高效解决能源动力、船舶海洋、电子设备和车辆运载等领域复杂的流动和传热问题。软件涵盖了从建模、仿真到结果处理完整仿真分析流程,帮助工业企业建立设计、仿真和优化相结合的一体化流程&#x…

3D开发工具HOOPS:助力Navisworks数据处理与3D模型可视化!

在过去的25年中,Tech Soft 3D一直以其卓越的3D技术不断帮助全球600多家客户实现创新,这些客户包括HEXAGON、SolidWorks、SIEMENS、Aras、ANSYS、AVEVA等各行业领军企业。 该公司拥有四款原生产品,分别是:HOOPS Exchange、HOOPS C…

程序员就业时要考虑什么?

要考虑的事情可多了,但很多毕业生都没有这个意识,光想着把自己给卖了。 我还记得自己刚毕业那年,光想着工资高,结果进了熬夜“大班”——一家外包公司。有项目的时候真不是996这么简单,每天是9126,赶上中秋…

jsp获取数据 jsp直接获取后端数据 获取input选中的值 单选 没 checked属性

let str0${showList}; let str1${showList}; 然后可以通过JSON.parse() 转 获取input选中的值 //goodsType 按类别 goods按货品var oneType $("input[ namecriteria1 ] ").val();//count按数量 totalprice按费用var twoType $("input[ namecriteria2 ] &q…

如何选择合适的全渠道智慧收银解决方案?亿发推荐智能收银一体化系统

在数字化时代,品牌面临着越来越多的挑战和机遇。为了更好地适应市场的变化,提高竞争力,越来越多的企业选择引入新零售经营解决方案,以实现定制化的用户运营,沉淀私域流量池,提升流量的高效转化,形成一个完善…

elementUI 特定分辨率(如1920*1080)下el-row未超出一行却换行

在1920*1080分辨率下, el-col 内容未超出 el-col 宽度,el-col 不足以占据一行,el-row 却自动换行了(其他分辨率没有这个问题)。 截图: 排查: el-col 内容没有溢出;没有多余的 pad…

一次不接受官方建议导致的事故

记录一下 一次Elasticsearch集群事故分析、排查、处理 背景介绍 事故发生的ElasticSearch集群共有7台机器: 10.163.204.19310.163.204.19410.163.204.19510.163.220.7310.163.220.7410.163.220.22010.163.220.221 其中193、194、195的机器配置一样,具…

Boris FX Mocha Pro 2023:Mac/win全能影像处理神器

Boris FX Mocha Pro 2023是一款广受欢迎的影像处理软件,它凭借其强大的功能和卓越的性能,成为了影视后期、广告制作、动画设计等领域的必备工具。无论您是专业的影视制作人员,还是初入行的新手,Boris FX Mocha Pro 2023都能为您的…