JavaScript 反射学习技巧


Posted in Javascript onOctober 16, 2021

1、前言

根据 MDN 官网解释: Reflect 是一个内置的对象,它提供拦截 JavaScript 操作的方法。这些方法与 proxy handlers (en-US) 的方法相同。 Reflect 不是一个函数对象,因此它是不可构造的。

那么它到底是什么?根据上面文件介绍会发现它和 Proxy 极像,都是获取执行函数本身信息。主要是区别在于所有的函数对象属性过于复杂,而且额外增加可能会导致程序行为不合理,所以扩展 Reflect 函数来专门对函数对象处理调用方法,构造对象,获取或者设置属性等相关操作。

2、接口

Reflect 里面所有的方法都是静态方法,不需要构造函数或者实例化它。

  • Reflect.apply(target, thisArgument, argumentsList)、对一个函数进行调用操作,同时可以传入一个数组作为调用参数。和 Function.prototype.apply() 功能类似。
  • Reflect.construct(target, argumentsList[, newTarget\] )对构造函数进行 new 操作,相当于执行 new target(...args) 。
  • Reflect.defineProperty(target, propertyKey, attributes)和 Object.defineProperty() 类似。如果设置成功就会返回 true
  • Reflect.deleteProperty(target, propertyKey)作为函数的 delete 操作符,相当于执行 delete target[name]  。
  • Reflect.get(target, propertyKey[, receiver\])获取对象身上某个属性的值,类似于 target[name]
  • Reflect.getOwnPropertyDescriptor(target, propertyKey)类似于 Object.getOwnPropertyDescriptor() 。如果对象中存在该属性,则返回对应的属性描述符, 否则返回 undefined .
  • Reflect.getPrototypeOf(target)类似于 Object.getPrototypeOf()
  • Reflect.has(target, propertyKey)判断一个对象是否存在某个属性,和 in 运算符 的功能完全相同。
  • Reflect.isExtensible(target)类似于 Object.isExtensible() .
  • Reflect.ownKeys(target)返回一个包含所有自身属性(不包含继承属性)的数组。(类似于 Object.keys() , 但不会受 enumerable影响 ).
  • Reflect.preventExtensions(target)类似于 Object.preventExtensions() 。返回一个 Boolean
  • Reflect.set(target, propertyKey, value[, receiver\])将值分配给属性的函数。返回一个 Boolean ,如果更新成功,则返回 true
  • Reflect.setPrototypeOf(target, prototype)设置对象原型的函数. 返回一个 Boolean , 如果更新成功,则返回 true

3、简单的例子

比如现在有个函数:

class Person {
  constructor(firstName, lastName) {
    this.firstName = firstName
    this.lastName = lastName
  }
  get getName() {
    return this.firstName + ' ' + this.lastName
  }
}

正常使用只需要进行实例化即可:

const person = new Person('Jaxson', 'Wang')
console.log(person.getName) // Jaxson Wang

可以使用 Reflect.construct() 方法来创建对象:

const person = Reflect.construct(Person, ['Jaxson', 'Wang'])
console.log(person) // Jaxson Wang

4、结语

Reflect 对象经常和 Proxy 代理一起使用,原因有三点:

  • Reflect 提供的所有静态方法和 Proxy 第2个 handle 参数方法是一模一样的。
  • Proxy get/set() 方法需要的返回值正是 Reflectget/set 方法的返回值,可以天然配合使用,比直接对象赋值/获取值要更方便和准确。
  • receiver 参数具有不可替代性。

到此这篇关于JavaScript 反射学习技巧的文章就介绍到这了,更多相关JavaScript 反射内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
DEFER怎么用?
Jul 01 Javascript
零基础学JavaScript最新动画教程+iso光盘下载
Jan 22 Javascript
JSON 学习之JSON in JavaScript详细使用说明
Feb 23 Javascript
用JavaScript对JSON进行模式匹配 (Part 2 - 实现)
Jul 17 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
Dec 19 Javascript
无限树Jquery插件zTree的常用功能特性总结
Sep 11 Javascript
JavaScript中string对象
Jun 12 Javascript
jQuery弹出遮罩层效果完整示例
Sep 13 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
Apr 01 Javascript
vue配置文件实现代理v2版本的方法
Jun 21 Javascript
微信小程序点击view动态添加样式过程解析
Jan 21 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
Jul 28 Javascript
JS的深浅复制详细
Oct 16 #Javascript
JS 基本概念详细介绍
Oct 16 #Javascript
AJAX实现指定部分页面刷新效果
AJAX实现省市县三级联动效果
Oct 16 #Javascript
简单聊聊Vue中的计算属性和属性侦听
Oct 05 #Vue.js
JS中如何优雅的使用async await详解
Oct 05 #Javascript
js中Object.create实例用法详解
Oct 05 #Javascript
You might like
php下连接ftp实现文件的上传、下载、删除文件实例代码
2010/06/03 PHP
php中运用http调用的GET和POST方法示例
2014/09/29 PHP
php mysql操作mysql_connect连接数据库实例详解
2016/12/26 PHP
PHP基于redis计数器类定义与用法示例
2018/02/08 PHP
Jquery Select操作方法集合脚本之家特别版
2010/05/17 Javascript
Jquery截取中文字符串的实现代码
2010/12/22 Javascript
IE下使用cloneNode注意事项分享
2012/11/22 Javascript
js将控件隐藏及display属性的使用介绍
2013/12/30 Javascript
js解决弹窗问题实现班级跳转DIV示例
2014/01/06 Javascript
多选列表框动态添加,移动,删除,全选等操作的简单实例
2014/01/13 Javascript
jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动
2014/03/27 Javascript
ajax提交表单实现网页无刷新注册示例
2014/05/08 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
javascript中SetInterval与setTimeout的定时器用法
2015/08/24 Javascript
跟我学习javascript的call(),apply(),bind()与回调
2015/11/16 Javascript
Node.js+Express配置入门教程详解
2016/05/19 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
2017/12/16 Javascript
分享ES6的7个实用技巧
2018/01/18 Javascript
Layui table field初始化加载时进行隐藏的方法
2019/09/19 Javascript
JS实现可视化音频效果的实例代码
2020/01/16 Javascript
使用Vant完成通知栏Notify的提示操作
2020/11/11 Javascript
利用Vue实现简易播放器的完整代码
2020/12/30 Vue.js
[00:26]TI7不朽珍藏III——冥界亚龙不朽展示
2017/07/15 DOTA
Python的Urllib库的基本使用教程
2015/04/30 Python
Python使用pygame模块编写俄罗斯方块游戏的代码实例
2015/12/08 Python
详解Python给照片换底色(蓝底换红底)
2019/03/22 Python
python操作yaml说明
2020/04/08 Python
排序都有哪几种方法?请列举。用JAVA实现一个快速排序
2014/02/16 面试题
自我评价格式
2014/01/06 职场文书
机械制造专业毕业生求职信
2014/03/02 职场文书
爱的奉献演讲稿
2014/09/10 职场文书
党委班子纠正“四风”问题整改措施
2014/10/28 职场文书
导游词之天下银坑景区
2019/11/21 职场文书
Oracle中日期的使用方法实例
2022/07/07 Oracle