ES6学习笔记11 Reflect

js版本ES6、ES7、ES8、ES9、ES10、ES11、ES12、ES13、ES14[2023]新特性 ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言,本文讲述Javascript[ECMAScript]版本ES6、ES7、ES8、ES9、ES10、ES11、ES12、ES13、ES14[2023]的新特性,帮助朋友们更好的熟悉和使用Javascript。 阅读详情

Reflect对象设计目的

(1)将Object对象的一些明显属于语言内部的方法(比如Object.defineProperty),放到Reflect对象上。

(2)修改某些Object方法的返回结果。例如Object.defineProperty(obj, name, desc)在无法定义属性时,会抛出一个错误,而Reflect.defineProperty(obj, name, desc)则会返回false。

(3)让Object操作都变成函数行为。例如原来的key in obj和delete obj[key],Reflect.hasProperty(obj,key)和Reflect.deleteProperty(obj,key)让其变为函数

(4)Reflect对象的方法与Proxy对象的方法一一对应,只要是Proxy对象的方法,就能在Reflect对象上找到对应的方法。不管Proxy怎么修改默认行为,你总可以在Reflect上获取默认行为。

Proxy(target, {
  set: function(target, name, value, receiver) {
    var success = Reflect.set(target,name, value, receiver);
    if (success) {
      log('property ' + name + ' on ' + target + ' set to ' + value);
    }
    return success;
  }
});

上述代码拦截了对象的属性设置操作,但其在内部又调用了默认的属性复制行为

静态方法

Reflect对象的大部分方法与Object对象的同名方法作用是相同的,且与Proxy对象方法对应

  • Reflect.apply(target, thisArg, args):该方法等同于function.prototype.apply.call(func, thisArg, args)
function.prototype.apply.call(func, thisArg, args);
// 等同于
(FuncApply).call(func,thisArg,args);
// 等同于
func.FuncApply(thisArg,args);
// 等同于
func.apply(thisArg,args);
// 等同于
thisArgs.func(args);
// 为什么不直接写成func.apply(thisArg,args)呢,这是因为有可能函数本身定义了自己apply方法
  • Reflect.construct(target, args):该方法等同于new target(…args)
  • Reflect.get(target, name, receiver):查找并返回target对象的name属性,函数中this绑定receiver参数
//this 绑定receiver参数
var myObject = {
  foo: 1,
  bar: 2,
  get baz() {
    return this.foo + this.bar;
  },
};

var myReceiverObject = {
  foo: 4,
  bar: 4,
};

Reflect.get(myObject, 'baz', myReceiverObject) // 8
  • Reflect.set(target, name, value, receiver):设置target对象的name属性值为value,函数中this绑定receiver参数,该方法的调用会触发Proxy.defineProperty拦截
  • Reflect.defineProperty(target, name, desc):等同于Object.defineProperty,如果第一个参数不是对象,会报错
  • Reflect.deleteProperty(target, name):等同于delete obj[name],用于删除对象属性,成功返回true
  • Reflect.has(target, name):对应于key in obj的in运算符,如果第一个参数不是对象,会报错
  • Reflect.ownKeys(target):返回对象自身所有属性,等同于Object.getOwnPropertyNames与Object.getOwnPropertySymbols之和
  • Reflect.isExtensible(target):对应于Object.isExtensible(target),如果第一个参数不是对象,会报错
  • Reflect.preventExtensions(target):对应于Object.preventExtensions(target),使对象不可扩展,如果参数不是对象,会报错
  • Reflect.getOwnPropertyDescriptor(target, name):等同于Object.getOwnPropertyDescriptor,如果第一个参数不是对象,会报错
  • Reflect.getPrototypeOf(target):读取对象的原型对象。其与Object.getPrototypeOf(target)区别在于,如果参数不是对象,后者会先转换为对象,而前者报错
  • Reflect.setPrototypeOf(target, prototype):设置对象的原型对象。如果第一个参数不是对象或为null、undefined,直接报错

实例使用Proxy实现观察者模式

const person = observable({
  name: '张三',
  age: 20
});

function print() {
  console.log(`${person.name}, ${person.age}`)
}

observe(print);
person.name = '李四';
// 输出
// 李四, 20
const queuedObservers = new Set();

const observe = fn => queuedObservers.add(fn);
const observable = obj => new Proxy(obj, {set});

function set(target, key, value, receiver) {
  const result = Reflect.set(target, key, value, receiver);
  queuedObservers.forEach(observer => observer());
  return result;
}

上述代码将所有观察者函数都放入集合中,然后拦截对象的属性赋值操作,一旦有属性改动,自动执行所有观察者函数

ES6(Proxy 和 Reflect) Proxy 和 Reflect1.Proxy 和 Reflect 的概念Proxy 意为 ‘代理’,连接了用户和真实对象之间的一个层Reflect 意为‘反射’   反射的是Object2.适用场景 一、Proxy 语法1.类似于供应商的原始对象 obj ,通过 Proxy 新生成对象,这个对象是映射 Object 的,用户访问 monitor,通过 Proxy ,再传递给 obj 对象。2.设置... 阅读详情

相关推荐

【逆强化学习-1】学徒学习(Apprenticeship Learning)

逆强化学习算法1:学徒学习。算法原理+算法步骤+代码+仿真:一个基于gym的小车上山的仿真。附赠学徒学习+Q-Table及学徒学习+DQN的全套代码。

体会编程语言独到的美 7494

ES6 之 Reflect 的方法总结(转载)

原作者地址:https://www.cnblogs.com/houfee/p/11369609.html 1. 概述 将 Object 对象的一些明显属于语言内部的方法(比如 Object.defineProperty ),放到 Reflect 对象上。 修改某些 Object 方法的返回结果,让其变得更合理。比如, Object.defineProperty(obj, name, desc) 在无法定义属性时,会抛出一个错误,而 Reflect.defineProperty(obj, n

qq_40289624的博客 1138

【SLAM论文笔记】SplaTAM论文小结

参考方法有ORB-SLAM3、Point-SLAM、NICE-SLAM、Kintinuous、ElasticFusion,测试数据集有ScanNet++、Replica、TUM-RGBD、Orig-ScanNet,SpaTAM并未在全部对比均为第一,表现最佳的是在ScanNet++、Replica,ScanNet++上SplaTAM方法位姿精度比第2名ORB-SLAM3高两个数量级,在TUM。上无稀疏SLAM结果,NICE-SLAM与Point-SLAM占优。SplaTAM基本做到了SOTA。

持之以恒 1010

reflect的13个方法

一:Reflect.get(target, name, receiver) target: 目标对象 name: 是我们要读取的属性。receiver(可选): 可以理解为上下文this对象。 二:Reflect.set(target,name,value,receiver) target: 我们需要操作的对象。 name: 我们需要设置该对象的属性名。value: 我们要设置的属性值。 receiver: 可以理解为上下文this对象。如果我们在设置值的时候遇到setter函数,该参数就指向与s

han_gitHub的博客 1368

iOS开发者必备:从越狱设备里提取IPA的三种方法(含Filza、iTools实战)

本文详细介绍了iOS开发者从越狱设备提取IPA文件的三种实用方法,包括使用Filza文件管理器、AFC2配合桌面工具以及命令行高级技术。内容涵盖环境准备、操作步骤和技术原理,帮助开发者高效获取应用包文件,适用于逆向工程、测试分析等场景。

weixin_28717969的博客 817

Cadence 17.2 OrCAD原理图库实战:从零创建电阻/电容/LED元件(附封装技巧)

本文以Cadence 17.2 OrCAD为核心,详细讲解了如何从零开始工程化地创建电阻、电容、LED等原理图库元件。内容涵盖库架构设计、符号绘制、引脚属性管理、封装关联技巧以及设计规则检查,旨在帮助硬件工程师构建规范、可复用且易于维护的元件库,为高效PCB设计奠定坚实基础。

weixin_29195615的博客 400

Reflect 映射

Reflect 映射 1. Reflect 映射 Reflect对象与 Proxy 对象一样,也是 ES6 为了操作对象而提供的新 API Reflect 是一个内置的对象,而不是一个函数对象,因此它是不可构造的 Reflect 作用: 优化 Object 的一些操作方法以及合理的返回 Object 操作返回的结果 Proxy 在拦截访问目标对象,或者对代理对象操作都是通过 Reflect 映射来完成 let obj = { name: 'jsx' }; // 获取对象属性 console.log(

langmanboy的博客 678

保姆级教程:用Code Blocks搞定中科蓝讯AB5768E蓝牙音响SDK开发环境(附资源包)

本文提供了一份详细的Code Blocks配置指南,帮助开发者快速搭建中科蓝讯AB5768E蓝牙音响SDK开发环境。从工具链安装、环境配置到工程导入和调试技巧,涵盖全流程避坑要点,特别适合K12开发板初学者。附资源包下载,助您高效完成蓝牙音响开发。

weixin_28692817的博客 448

js之Reflect 反射

Reflect是一个内置的对象,它提供了拦截JavaScript操作的方法。它不是一个函数对象,因此不可构造。Reflect对象提供了一些静态方法来操作对象,例如等。这些方法可以用于读取、修改或删除对象的属性,并返回相应的结果。在Vue 3中,Reflect也被用作一个修饰符(decorator),用于监听DOM元素上的属性变化并将其反映到Vue实例的数据上。当DOM元素的属性发生变化时,Vue会捕获这些变化,并更新相应的数据,从而保持数据和视图的同步。

qq_53742640的博客 3362

大学计算 - NumPy库的矩阵运算 实训答案

本文介绍了三个NumPy矩阵操作的实验练习。第一关练习ndarray类型操作,包括矩阵构造、元素平方和计算、矩阵乘积运算和逆矩阵行列式计算;第二关针对matrix类型,涉及绝对值最大值获取、特定矩阵乘积运算和转置矩阵特征值计算;第三关实现Moore-Penrose伪逆矩阵计算,并与NumPy内置pinv函数结果比较误差。实验涵盖了NumPy核心矩阵操作,展示了从基础运算到高级矩阵分解的应用,帮助掌握科学计算中的矩阵处理技巧。

2403_89314916的博客 310

MATLAB使用贝叶斯网络bnt工具箱:使用手册详解

MATLAB使用贝叶斯bnt网络工具箱:使用手册详解

WW、forever的博客 2676

Reflect 对象(JavaScript 反射 )相关API解读

本文记录JavaScript中Reflect对象的相关API;

m0_65029152的博客 2461

Kubeflow系统性学习教程:从入门到高级实践

Kubeflow学习教程摘要(150字): Kubeflow是基于Kubernetes的云原生MLOps平台,提供端到端机器学习解决方案。核心功能包括Jupyter Notebooks开发环境、Pipelines工作流编排、分布式训练支持和模型服务部署。教程采用三阶段学习路径:初学者搭建Kind集群体验Notebooks;中级开发自定义Pipeline组件;高级实现企业级应用。通过容器化和K8s CRD深度集成,解决环境一致性、实验跟踪和资源调度等MLOps痛点,相比MLflow/Airflow更适合大规模

自可乐的博客 887

es6学习笔记11--Proxy和Reflect

Proxy概述 Proxy用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程。 Proxy可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。Proxy这个词的原意是代理,用在这里表示由它来“代理”某些操作,可以译为“代理器”...

weixin_33778544的博客 255

jre9下载 jdk9

(Java SE Runtime Environment 9.0) 9.0u175 官方最新版 【x86|x64】

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

ES6之Reflect和Proxy

目录一、Reflect1. 概述二、Proxy 一、Reflect 1. 概述 设计Reflect主要有以下四个目的: 将Object上属于语言内部的方法部署到Reflect,并且以后新增的语言内部方法只会部署到Reflect上。如Object.defineProperty在ES6中可以通过Reflect.defineProperty调用,并且前者在之后的版本中将不再被推荐。 规范某些Objec...

夕山雨的博客 1897

复分析 阿尔福斯(Ahlfors) 第三版答案 英文

答案分为十章,有部分习题没有答案,全英文复分析阿尔福斯(Ahlfors) 第三版答案

ES6黑科技实践--proxy,reflect

最近逛GitHub看到大神sindresorhus 新出的on-change对象数组监听库。看了下代码,基于proxy实现。于是顺便研究一下es6中的proxy和reflect。

程鹏飞的博客 1万+

老版QQ原生表情gif动态

这是老版的QQ表情,不过全是动态的的,Windows照片查看器是不会动的,可以右击用浏览器打开查看,再说一遍是老版的,只是分享给宁愿用老版也要动态的人。

一文大白话讲清楚ES6代理Proxy和反射Reflect

一文大白话讲清楚ES6代理Proxy和反射Reflect

xiaobangkeji的博客 1348

es6中的Reflect

// Reflect对象与Proxy对象一样,也是 ES6 为了操作对象而提供的新 API。Reflect对象的设计目的有这样几个。 // (1) 将Object对象的一些明显属于语言内部的方法(比如Object.defineProperty),放到Reflect对象上。 //现阶段,某些方法同时在Object和Reflect对象上部署,未来的新方法将只部署在Reflect对象上。也就是说,从R...

wyw223的博客 225

【ES6】Reflect 反射

>- Reflect 是为了操作对象而提供的新 API >- Reflect 是一个内置的对象,它提供拦截 JavaScript 操作的方法。 >- 这些方法与proxy handlers (en-US)的方法相同。 >- Reflect不是一个函数对象,因此它是不可构造的。 >- 所以不能通过new运算符对其进行调用,或者将Reflect对象作为一个函数来调用。 >- Reflect的所有属性和方法都是静态的

qq_45677671的博客 1880

ES6学习笔记(8)——Reflect

Reflect 设计目的 将Object对象的一些明显属于语言内部的方法(比如Object.defineProperty),放到Reflect对象上。然后就可以从Reflect对象上可以拿到语言内部的方法 修改某些Object方法的返回结果,让其变得更合理。比如,Object.defineProperty(obj, name, desc)在无法定义属性时,会抛出一个错误,而Reflect.defineProperty(obj, name, desc)则会返回false // 老写法 try {

aaaaapipi的博客 217

ES6语法——Proxy、Reflect

Proxy、Reflect Proxy和Reflect的概念 Proxy和Reflect的使用场景 Proxy (代理即拦截) 代理 { //obj作为原始对象,原始对象存储真实数据 //通过new Proxy() 新生成一个对象,这个对象映射obj,让它在中间做一些操作 //最后用户访问的是monitor,不管用户是设置monitor还是读取monitor属性,最终通过Proxy传递给ob...

cjexe的博客 282

ES6——Proxy和Reflect详解

Proxy用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(metaprogramming),即对编程语言进行编程。Proxy可以理解成在目标对象前架设一“拦截”层,外界对该对象的访问都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。Proxy这个词的原意是代理,用在这里表示由它来“代理”某些操作,可以译为“代理器”​。Reflect对象与Proxy对象一样,也是ES6为了操作对象而提供的新API。Reflect对象的设计目的有以下几个。

吴声子夜歌的博客 403

ES6-Proxy与Reflect 实现重载(overload)

Proxy与Reflect实现重载(overload) 从语法角度讲JavaScript不支持重载。原因很简单,JS中函数可以传入任意类型、任意个数的参数,通通可以通过在函数内使用this.arguments获得。这样,就无法实现同名函数参数列表不同实现不同功能。当然,在实际使用过程中,可以人为去检测传入实参的个数及类型,来进行不同操作。但是,我认为这不能叫做重载。 ES6带来了Proxy和R

柒青衿的博客 4518

ECMAScript 6 之Reflect

目录1. 概述2. Reflect对象静态方法2.1 Reflect.get() 1. 概述 Reflect对象与Proxy对象一样,也是 ES6 为了操作对象而提供的新 API。 Reflect不是一个函数对象,它是不可构造的,而且Reflect的所有属性和方法都是静态的。 Reflect对象的设计目的有这样几个: 将Object对象的一些明显属于语言内部的方法,放到Reflect对象上 修改...

基地的博客 592

ES6 Proxy 代理器与 Reflect

1. 概述 Proxy 用于修改某些默认行为,可以理解为在目标对象之前架设一层拦截,外界对该对象的访问,都必须通过这层拦截。因此提供了一种机制,用来对外界的访问进行过滤和改写。这种机制即代理器。 ES6 提供 Proxy 构造函数,用于生成 Proxy 实例 var proxy = new Proxy(target,handle); //target 表示要拦截的对象 //handle 也是对象,表示拦截行为 下面是一个拦截读取属性行为的例子 var proxy = new Proxy({}

JMisagirl的博客 336
上一篇: ES6学习笔记10 Proxy
下一篇: ES6学习笔记12 Promise
PAT-python-zjw
博客等级 码龄10年 381粉丝 408原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值