前端 JS 经典:Reflect 本质

1. 什么是 Reflect

Reflect 可以调用对象的基本方法(内部方法),在 ES6 之前我们是没有任何方法去直接调用对象的基本方法的。只能间接调用,间接调用它又会给你做一些额外得事。

2. 对象的基本方法

什么是对象的基本方法呢,对象内部运行的方法就是对象的基本方法。对象的基本方法有哪些,它对应的反射方法是什么。如下:

// 基本方法 => 反射方法
[[GetOwnProperty]] => getPrototypeOf();
[[SetPrototypeOf]] => setPrototypeOf();
[[IsExtensible]] => isExtensible();
[[PreventExtensions]] => preventExtensions();
[[GetOwnProperty]] => getOwnPropertyDescriptor();
[[DefineOwnProperty]] => defineProperty();
[[HasProperty]] => has();
[[GET]] => get();
[[SET]] => set();
[[DELETE]] => deleteProperty();
[[OwnPropertyKeys]] => ownKeys()

3. Reflect 有什么用

我们举个例子,下面这两个语句是同样的作用,都是设置 name 的值:

let obj = { name: "yq" };
obj.name = "yqcoder";
console.log(obj); // { name: 'yqcoder' }
let obj = { name: "yq" };
Reflect.set(obj, "name", "yqcoder");
console.log(obj); // { name: 'yqcoder' }

那么既然都是做的同样的是,它们有什么区别呢。区别在于,通过语法或者一些 API 去调用对象的内部方法的话,它会经过一些规则和步骤,在这些规则和步骤当中,有一步是在调用这个内部方法。如果你不希望有这些额外步骤存在,那就需要你直接去调用对象的基本方法了。使用 Reflect。

4. 为什么要用 Reflect

有小伙伴就问了,我为啥要直接调用对象的基本方法,用语法进行对象操作不好吗。肯定是因为 Reflect 可以做一些语法做不到的事,我们才会去使用 Reflect。比如:

let obj = {a: 1,b: 2,get c() {return this.a + this.b;},
};
obj.c; // 3

上面的 obj.c 实际是通过[[GET]](obj, 'c', obj),去得到的值,当我们想通过 obj.c 改变 this 的指向,这时做不到的,用 Reflect 就可以。如下,就改变了 this 的指向。

let obj = {a: 1,b: 2,get c() {return this.a + this.b;},
};
Reflect.get(obj, "c", { a: 3, b: 4 }); // 7

另外,有的时候我们去封装代理对象的时候,也需要用到 Reflect,比如,我们需要得到这么一个代理,访问 proxy.c 时,需要将 a,b 一起打印出来。

let obj = {a: 1,b: 2,get c() {return this.a + this.b;},
};
const proxy = new Proxy(obj, {get(target, key) {console.log(key);return Reflect.get(target, key, proxy);},
});
proxy.c; // c a b

 再比如,我们需要获取到对象得所有属性

let obj = {a: 1,b: 2,
};
Object.defineProperty(obj, "c", {value: 3,enumerable: false,
});
Object.keys(obj); // ['a', 'b']
Reflect.ownKeys(obj); // ['a', 'b', 'c']

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

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

相关文章

搜索与图论:图中点的层次

搜索与图论&#xff1a;图中点的层次 题目描述参考代码 题目描述 输入样例 4 5 1 2 2 3 3 4 1 3 1 4输出样例 1参考代码 #include <cstring> #include <iostream> #include <algorithm>using namespace std;const int N 100010;int n, m; int h[N], e[N]…

后端开发面经系列--360一面面经

360嵌入式开发一面面经 公众号&#xff1a;阿Q技术站 来源: https://www.nowcoder.com/feed/main/detail/22a2f509f0a94c3cbb8ba485de084d19 1、Wi-Fi关联是怎么做的了解过吗&#xff1f; 扫描可用网络&#xff1a; 设备会主动扫描附近的无线网络&#xff0c;以查找可用的Wi-…

【Linux网络】传输层协议 - UDP

文章目录 一、传输层&#xff08;运输层&#xff09;运输层的特点复用和分用再谈端口号端口号范围划分认识知名端口号&#xff08;Well-Know Port Number&#xff09;两个问题① 一个进程是否可以绑定多个端口号&#xff1f;② 一个端口号是否可以被多个进程绑定&#xff1f; n…

常用STL标准模板库

1 容器&#xff08;Containers&#xff09; 1.1 序列式容器 1.1.1 vector 数组 1.1.2 string 字符串 1.1.3 list 列表 1.1.4 stack 栈 1.1.5 queue 队列 1.1.6 deque 双端队列 1.2 关联式容器 1.2.1 set / multiset 集合 / 多重集合 1.2.2 pair 对组 1.2.3 map / mu…

德国西门子论未来质量管理 - 如何与明天相遇?

未来制造业的质量 -- 如何用软件方案满足质量要求 作者&#xff1a;Bill Butcher 翻译&编辑&#xff1a;数字化营销工兵 【前言】在Frost&Sullivan最近发表的一份白皮书中&#xff0c;他们讨论了制造业的质量投资。质量是制造过程的关键要素&#xff0c;但似乎比其他…

vllm 大模型量化微调推理使用: lora、gptq、awq

1)微调lora模型推理 docker run --gpus all -v /ai/Qwen1.5-7B-Chat:/qwen-7b -v /ai/lora:/lora -p 10860:10860 --

LiveData是如何感知Room数据变化的

一 Room数据变化LiveData如何收到onChanged回调的&#xff1f; 1.1 LiveData是如何创建的 这里讨论的LiveData的创建是特指Dao定义的方法的返回类型&#xff0c;而不是所有的LiveData。 以NoteDao 举例&#xff1a; Dao public interface NoteDao {Query("select * fr…

【贡献度分析(帕累托图)】

文章目录 前言一、贡献度分析是什么&#xff1f;二、使用步骤1. 准备数据2. 排序数据3. 绘制帕累托图4. 分析结果5. 实际应用 三、示例代码 前言 贡献度分析也称为帕累托分析。它可以帮助我们理解数据集中各个因素对整体影响的程度&#xff0c;从而优先处理最重要的因素&#…

代码随想录算法训练营第四十九天| 139.单词拆分、背包问题总结

139.单词拆分 题目链接&#xff1a;139.单词拆分 文档讲解&#xff1a;代码随想录/单词拆分 视频讲解&#xff1a;视频讲解-单词拆分 状态&#xff1a;已完成&#xff08;0遍&#xff09; 解题过程 这几天博主忙着面试和入职&#xff0c;一晃已经周四了&#xff0c;这个礼拜…

大模型微调工具LLaMA-Factory docker安装、大模型lora微调训练

参考: https://github.com/hiyouga/LLaMA-Factory 报错解决: 1)Docker 构建报错 RuntimeError: can’t start new thread: https://github.com/hiyouga/LLaMA-Factory/issues/3859 修改后的Dockerfile: FROM nvcr.io/nvidia/pytorch:24.01-py3WORKDIR /appCOPY requirem…

oracle数据库通过impdp导入数据时提示,ORA-31684:对象类型用户xxx已存在,和ORA-39151:表xxx存在的解决办法

前提条件&#xff1a;首先备份原数据库中此用户对应的schemas 比如名为cams_wf的schemas 以便出了问题后还可以恢复原数据。 解决办法一、 通过命令或者数据库管理工具删除掉此schemas下的所有表&#xff0c;然后在impdp中加入ignorey 来忽略ORA-31684&#xff1a;对象类型用…

Python logging 模块详解

Python 的 logging 模块提供了一个强大而灵活的日志系统。它是 Python 标准库的一部分&#xff0c;因此可以在任何 Python 程序中使用。logging 模块提供了许多有用的功能&#xff0c;包括日志消息的级别设置、日志消息的格式设置、将日志消息输出到不同的目标&#xff0c;以及…

深度解读ChatGPT

技术基础&#xff1a; ChatGPT是一种基于人工智能技术的自然语言处理工具&#xff0c;特别是自然语言生成&#xff08;NLG&#xff09;模型。它采用了Transformer架构&#xff0c;这是一种深度学习模型&#xff0c;特别适用于处理序列数据&#xff0c;如自然语言文本。 工作原理…

UE5刷植物悬空了

UE5系列文章目录 文章目录 UE5系列文章目录前言一、解决办法 前言 在Unreal Engine5.3中使用植物模式刷各种植物时&#xff0c;有时会发现有的植物要么悬空&#xff0c;要不有刷不上地板的情况。而且悬空的植物还不能接触到地面&#xff0c;感觉很奇怪&#xff0c;就像下图所示…

mmdetection的生物图像实例分割三:自定义数据集的测试与分析

mmdetection的生物图像实例分割全流程记录 第三章 自定义数据集的测试、重建与分析 文章目录 mmdetection的生物图像实例分割全流程记录前言一、测试集的推理1.模型测试2.测试数据解析 二、测试结果的数据整合三、生物结构的重建效果 前言 mmdetection是一个比较容易入门且上…

Kotlin 引用(双冒号::)

文章目录 双冒号::引用函数普通函数成员函数类构造函数 引用变量&#xff08;很少用&#xff09;普通变量成员变量 双冒号:: Kotlin 中可以使用双冒号::对某一变量、函数进行引用。 Note&#xff1a;MyClass::class可用于获取KClass<MyClass>&#xff0c;此时的双冒号::…

c time(NULL) time(time_t *p) 区别

chatgpt 的回答&#xff1a; time(NULL) 和 time(time_t *p) 都是用于获取当前系统时间的函数&#xff0c;但它们的用法略有不同。 time(NULL)&#xff1a; 这是 time 函数的简化版本&#xff0c;用于获取当前的系统时间&#xff0c;返回的结果是自 "Epoch"&#xf…

【研发日记】Matlab/Simulink软件优化(二)——通信负载柔性均衡算法

文章目录 前言 背景介绍 初始代码 优化代码 分析和应用 总结 前言 见《【研发日记】Matlab/Simulink软件优化(一)——动态内存负荷压缩》 背景介绍 在一个嵌入式软件开发项目中&#xff0c;需要设计一个ECU节点的CAN网路数据发送&#xff0c;需求是在500k的通信波特率上&a…

机器人舵机:关键要素解析与选择指南

在机器人技术日新月异的今天&#xff0c;舵机作为机器人的核心部件之一&#xff0c;扮演着至关重要的角色。它的性能直接关系到机器人的运动控制、稳定性以及精度等方面。那么&#xff0c;在选择和使用机器人舵机时&#xff0c;我们需要关注哪些关键要素呢&#xff1f;本文将为…

使用Vue.js将form表单传递到后端

一.form表单 <form submit.prevent"submitForm"></form> form表单像这样写出来&#xff0c;然后把需要用户填写的内容写在form表单内。 二.表单内数据绑定 <div class"input-container"><div style"margin-left: 9px;"&…