当前位置: 首页 > news >正文

理解V3中的proxy和reflect

现有如下面试题

结合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看不懂,有时间看下源码

相关文章:

理解V3中的proxy和reflect

现有如下面试题 结合GeexCode和Gpt // 这个函数名为onWatch,接受三个参数obj、setBind和getlogger。 // obj是需要进行监视的对象。 // setBind是一个回调函数,用于在设置属性时进行绑定操作。 // getlogger是一个回调函数,用于在获取属性时…...

实现寄生组合继承

寄生组合继承是一种继承方式,它通过组合使用构造函数继承和原型继承的方式,实现了高效而且正确的继承方式。 具体实现步骤如下: ① 定义一个父类,实现其属性和方法: function Person(name) {this.name namethis.age…...

ARM 账号注册报错 The claims exchange ‘Salesforce-UserWriteUsingEmail‘

ARM 账号注册报错 The claims exchange ‘Salesforce-UserWriteUsingEmail’ 参考:ARM 账号注册报错 The claims exchange ‘Salesforce-UserWriteUsingEmail’ specified in step ‘14’ returned HTTP error response with Code ‘BadRequest’ and Reason ‘Bad …...

笔记:电子设备接地,接的到底是什么地?

电路中有“地”,设备中有“地”;都是“地”,此地非彼地。 混淆的原因 有些混淆,是以为中文翻译造成的,英文所有Ground都统一翻译为“地”; 例1:英文Circuit Ground,应该翻译为电路…...

PY32F002A系列单片机:高性价比、低功耗,满足多样化应用需求

PY32F002A系列微控制器是一款高性能、低功耗的MCU,它采用32位ARM Cortex-M0内核,最高工作频率达到24MHz,提供了强大的计算能力。此外,PY32F002A拥有最大20Kbytes的flash存储器和3Kbytes的SRAM,为简单的数据处理提供了充…...

头歌的数据库的第三次作业的答案

目录 MySQL-安全性控制 第1关:用户和权限 第2关:用户、角色与权限 MySQL-触发器 第1关:为投资表property实现业务约束规则-根据投资类别分别引用不同表的主码 MySQL-数据的插入、修改与删除(Insert,Update,Delete) 第1关:插…...

前端3D规划

学习基础的3D概念:这包括向量、矩阵、几何、光照和材质等基本3D图形学的概念。这些是理解和使用3D技术的基础。学习WebGL:WebGL是一种在浏览器中实现3D图形的技术,它是OpenGL的Web版本,可以直接在浏览器中使用。学习WebGL可以帮助…...

appium操控微信小程序的坑

appium操控微信小程序的坑 打不开启动页面driver的context只有NATIVE_APP小程序上元素找不到 我打算使用appium操控微信小程序,只要能够获取到小程序的页面元素就算成功。下面都是我遇到的问题。 打不开启动页面 以下是我的appium的配置参数和代码: de…...

6 个最佳 Windows 免费磁盘分区管理器

几乎所有新的笔记本电脑和 PC 都只有一个分区 C:\,与安装了 Windows 的分区相同。不太精通技术的用户开始按照计算机呈现给他们的方式使用计算机;他们将所有文档、个人文件(例如图片、歌曲、电影等)放在同一个分区上。整个驱动器上…...

【Leetcode】【每日一题】【简单】2558. 从数量最多的堆取走礼物

力扣(LeetCode)官网 - 全球极客挚爱的技术成长平台备战技术面试?力扣提供海量技术面试资源,帮助你高效提升编程技能,轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/take-gifts-from-the-richest-pi…...

LeetCode 每日一题 2023/10/23-2023/10/29

记录了初步解题思路 以及本地实现代码;并不一定为最优 也希望大家能一起探讨 一起进步 目录 10/23 2678. 老人的数目10/24 1155. 掷骰子等于目标和的方法数10/25 2698. 求一个整数的惩罚数10/26 2520. 统计能整除数字的位数10/27 1465. 切割后面积最大的蛋糕10/28 2…...

Android:Installed Build Tools revision 33.0.2 is corrupted.

Remove and install again using the SDK Manager. 使用33.0.2及以上版本的build-tools编译Android应用时。 有些人会按照提示去SDK Manager中重新安装build tools,然后发现这样做是无用的 编译时会收到:Build-tool 33.0.2 is missing DX at D:\Sdk\b…...

语法复习之C语言与指针

内存是如何存储数据的? 在C语言中定义一个变量后,系统就会为其分配内存空间。这个内存空间包括了地址和长度。将变量赋值后,该值就被写入到了指定的内存空间中。内存空间的大小一般以字节作为基本单位。   普通变量存放的是数据&#xff0c…...

vue笔记(二)

7、事件处理 7.1、事件的基本处理 事件的使用 使用v-on&#xff1a;xxx或者用xxx绑定事件&#xff0c;其中XXX是事件名事件的回调需要配置在methods对象中&#xff0c;最终出现在VM上methods配置的函数&#xff0c;不需要箭头函数 <div id"root"><h1>…...

【IT行业就业前景广阔:探讨热门方向与就业机会】

IT行业哪个方向比较好就业? IT行业是一个快速发展的领域&#xff0c;与许多其他行业紧密结合&#xff0c;为各个行业带来了巨大的变革和机遇。在这个充满活力的行业中&#xff0c;有许多就业方向可以选择。让我们一起来探讨一下IT行业的发展背景、就业方向以及分享一些就业经…...

linux上java -jar方式运行项目及输出文件nohup.out的清理, linux上定时器的用法

linux上java -jar方式运行项目及输出文件nohup.out的清理&#xff0c; linux上定时器的用法 linux上java -jar方式运行定期自动清理nohup.out文件的内容**验证**定时器crontab使用时注意事项 linux上java -jar方式运行 参考&#xff1a;https://blog.csdn.net/qq_42169450/arti…...

macOS 12 Monterey v12.7.1正式版:开启全新的操作系统体验

macOS 12 Monterey已经向所有兼容的Mac设备推出&#xff0c;为您带来了一系列强大的新功能和改进。这个全新的操作系统版本&#xff0c;不仅带来了更流畅的用户体验&#xff0c;还增强了与iOS设备的无缝集成&#xff0c;让您的设备使用更加高效&#xff0c;更加便捷。 macOS 1…...

vue制作防止用户未登录或未填写信息就跳转页面的路由拦截器

在Vue中&#xff0c;你可以使用路由导航守卫来实现防止未登录用户跳转页面的路由拦截器。 首先&#xff0c;你需要创建一个全局前置守卫&#xff0c;用于检查用户是否已登录。在router/index.js文件中&#xff0c;添加如下代码&#xff1a; import router from /router;route…...

postgis ST_CoverageInvalidEdges用法

官方文档 概要 geometry ST_CoverageInvalidEdges(geometry winset geom, float8 tolerance 0); 描述 一个窗口函数&#xff0c;用于检查窗口分区中的多边形是否形成有效的多边形覆盖范围。 它返回线性指示器&#xff0c;显示每个多边形中无效边&#xff08;如果有&#x…...

sqlalchemy的部分函数合集

func.concat func.group_concat func.find_in_set func.sum func.left func.month func.round func.avg func.rpad func.ifnull func.replace func.date_format CONCAT 函数&#xff1a;将两个或多个字符串连接在一起。例如&#xff1a; SELECT CONCAT(Hello, , World) AS r…...

conda相比python好处

Conda 作为 Python 的环境和包管理工具&#xff0c;相比原生 Python 生态&#xff08;如 pip 虚拟环境&#xff09;有许多独特优势&#xff0c;尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处&#xff1a; 一、一站式环境管理&#xff1a…...

大数据学习栈记——Neo4j的安装与使用

本文介绍图数据库Neofj的安装与使用&#xff0c;操作系统&#xff1a;Ubuntu24.04&#xff0c;Neofj版本&#xff1a;2025.04.0。 Apt安装 Neofj可以进行官网安装&#xff1a;Neo4j Deployment Center - Graph Database & Analytics 我这里安装是添加软件源的方法 最新版…...

内存分配函数malloc kmalloc vmalloc

内存分配函数malloc kmalloc vmalloc malloc实现步骤: 1)请求大小调整:首先,malloc 需要调整用户请求的大小,以适应内部数据结构(例如,可能需要存储额外的元数据)。通常,这包括对齐调整,确保分配的内存地址满足特定硬件要求(如对齐到8字节或16字节边界)。 2)空闲…...

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以?

Golang 面试经典题&#xff1a;map 的 key 可以是什么类型&#xff1f;哪些不可以&#xff1f; 在 Golang 的面试中&#xff0c;map 类型的使用是一个常见的考点&#xff0c;其中对 key 类型的合法性 是一道常被提及的基础却很容易被忽视的问题。本文将带你深入理解 Golang 中…...

以下是对华为 HarmonyOS NETX 5属性动画(ArkTS)文档的结构化整理,通过层级标题、表格和代码块提升可读性:

一、属性动画概述NETX 作用&#xff1a;实现组件通用属性的渐变过渡效果&#xff0c;提升用户体验。支持属性&#xff1a;width、height、backgroundColor、opacity、scale、rotate、translate等。注意事项&#xff1a; 布局类属性&#xff08;如宽高&#xff09;变化时&#…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

《基于Apache Flink的流处理》笔记

思维导图 1-3 章 4-7章 8-11 章 参考资料 源码&#xff1a; https://github.com/streaming-with-flink 博客 https://flink.apache.org/bloghttps://www.ververica.com/blog 聚会及会议 https://flink-forward.orghttps://www.meetup.com/topics/apache-flink https://n…...

【论文阅读28】-CNN-BiLSTM-Attention-(2024)

本文把滑坡位移序列拆开、筛优质因子&#xff0c;再用 CNN-BiLSTM-Attention 来动态预测每个子序列&#xff0c;最后重构出总位移&#xff0c;预测效果超越传统模型。 文章目录 1 引言2 方法2.1 位移时间序列加性模型2.2 变分模态分解 (VMD) 具体步骤2.3.1 样本熵&#xff08;S…...