ES6中Proxy与Reflect实现重载(overload)的方法


Posted in Javascript onMarch 30, 2017

本文实例讲述了ES6中Proxy与Reflect实现重载(overload)的方法。分享给大家供大家参考,具体如下:

Proxy与Reflect实现重载(overload)

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

ES6带来了Proxy和Reflect,配合使用可以实现重载。Proxy用于修改某些操作的默认行为,相当于对原始想进行的操作进行“包装”;Reflect对象的方法与Proxy对象的方法一一对应,这使得Proxy对象可以方便的调用对应的Reflect方法完成默认行为。我们可以这样使用它们:

function LogMessage( m ){
  this.m = m;
}
var message = new LogMessage( 1 );
var overload = new Proxy(message , {
  get: function(target, key, receiver){
    console.log(`getting ${key}`);
    return Reflect.get(target , key , receiver);
  },
  set: function(target, key, value, receiver){
    console.log(`setting ${key}`);
    return Reflect.set(target, key, value, receiver);
  }
});
overload.m = 2; //setting m
var s = overload.m; //getting m

看到了没,是不是很有意思,新创建的Proxy对象overload可以完成目标对象message的操作,同时,可以通过在默认操作之前自定义一些其他操作。我认为,这更像Java里的重载。

那么Proxy与Reflect有哪些实例方法呢?

1.get()
用于拦截某个属性的读取操作。

2.set()
用于拦截某个属性的赋值操作。

3.has()
可以隐藏某些属性,不被in操作符遍历到。

4.construct()
用于拦截new命令。

5.deleteProperty()
用于拦截delete操作。

6.defineProperty()
用于拦截Object.defineProperty操作。

7.enumerate()
用于拦截for...in循环。

8.getOwnPropertyDescriptor()
用于拦截Object.getOwnPropertyDescriptor操作。

9.isExtensible()
用于拦截Object.isExtensible操作。

10.preventExtensions()
用于拦截Object.preventExtensions操作。

11.setPrototypeOf()
用于拦截Object.setPrototypeOf操作。

上面很多方法不是很常用,如果感兴趣可以去查查相关资料

希望本文所述对大家ECMAScript程序设计有所帮助。

Javascript 相关文章推荐
input+select(multiple) 实现下拉框输入值
May 21 Javascript
js操作ajax返回的json的注意问题!
Feb 23 Javascript
用jquery和json从后台获得数据集的代码
Nov 07 Javascript
浅谈javascript 迭代方法
Jan 21 Javascript
DOM操作一些常用的属性汇总
Mar 13 Javascript
基于jQuery实现多层次的手风琴效果附源码
Sep 21 Javascript
javascript常用经典算法实例详解
Nov 25 Javascript
jquery Deferred 快速解决异步回调的问题
Apr 05 Javascript
浅谈JavaScript变量的自动转换和语句
Jun 12 Javascript
微信小程序 合法域名校验出错详解及解决办法
Mar 09 Javascript
Vue 中可以定义组件模版的几种方式
Aug 06 Javascript
Typescript的三种运行方式(小结)
Sep 18 Javascript
vue分类筛选filter方法简单实例
Mar 30 #Javascript
教你快速搭建Node.Js服务器的方法教程
Mar 30 #Javascript
Vuejs仿网易云音乐实现听歌及搜索功能
Mar 30 #Javascript
canvas绘制一个常用的emoji表情
Mar 30 #Javascript
JavaScript装饰器函数(Decorator)实例详解
Mar 30 #Javascript
Angular.JS去掉访问路径URL中的#号详解
Mar 30 #Javascript
详解Angular.js数据绑定时自动转义html标签及内容
Mar 30 #Javascript
You might like
php实现可运算的验证码
2015/11/10 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
laravel 查询数据库获取结果实现判断是否为空
2019/10/24 PHP
Thinkphp框架+Layui实现图片/文件上传功能分析
2020/02/07 PHP
thinkphp5 框架结合plupload实现图片批量上传功能示例
2020/04/04 PHP
javascript如何判断输入的url是否正确
2014/04/11 Javascript
JS实现在网页中弹出一个输入框的方法
2015/03/03 Javascript
node.js调用C++开发的模块实例
2015/07/03 Javascript
JS实现不使用图片仿Windows右键菜单效果代码
2015/10/22 Javascript
使用JS实现图片展示瀑布流效果的实例代码
2016/09/12 Javascript
javascript 中Cookie读、写与删除操作
2017/03/29 Javascript
JavaScript实现选中文字提示新浪微博分享效果
2017/06/15 Javascript
详解vue或uni-app的跨域问题解决方案
2020/02/21 Javascript
python选择排序算法的实现代码
2013/11/21 Python
Python 不同对象比较大小示例探讨
2014/08/21 Python
Python 爬虫模拟登陆知乎
2016/09/23 Python
Python跨文件全局变量的实现方法示例
2017/12/10 Python
Python cookbook(数据结构与算法)将多个映射合并为单个映射的方法
2018/04/19 Python
django反向解析和正向解析的方式
2018/06/05 Python
5分钟 Pipenv 上手指南
2018/12/20 Python
Python Pandas 转换unix时间戳方式
2019/12/07 Python
python实现人脸签到系统
2020/04/13 Python
Python在后台自动解压各种压缩文件的实现方法
2020/11/10 Python
详解Python Celery和RabbitMQ实战教程
2021/01/20 Python
瑰珀翠美国官网:Crabtree & Evelyn美国
2016/11/29 全球购物
英国天然保健品网站:Simply Supplements
2017/03/22 全球购物
美国台面电器和厨具品牌:KitchenAid
2019/04/12 全球购物
澳大利亚Mocha官方网站:包、钱包、珠宝和配饰
2019/07/18 全球购物
一个大学生十年的职业规划
2014/01/17 职场文书
车间机修工岗位职责
2014/02/28 职场文书
党员干部2014全国两会学习心得体会
2014/03/10 职场文书
无私奉献演讲稿
2014/09/04 职场文书
与美同行演讲稿
2014/09/13 职场文书
个人融资协议书
2014/10/02 职场文书
用JS实现飞机大战小游戏
2021/06/09 Javascript
浅谈MySQL user权限表
2021/06/18 MySQL