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 相关文章推荐
TopList标签和JavaScript结合两例
Aug 12 Javascript
Jquery 类网页微信二维码图块滚动效果具体实现
Oct 14 Javascript
js禁止页面使用右键(简单示例代码)
Nov 13 Javascript
Node.js安装教程和NPM包管理器使用详解
Aug 16 Javascript
javascript实现通过表格绘制颜色填充矩形的方法
Apr 21 Javascript
谈谈基于iframe、FormData、FileReader三种无刷新上传文件的方法
Dec 03 Javascript
利用JQuery直接调用asp.net后台的简单方法
Oct 27 Javascript
JavaScript中this的用法实例分析
Dec 19 Javascript
vue-cli脚手架-bulid下的配置文件
Mar 27 Javascript
JavaScript callback回调函数用法实例分析
May 08 Javascript
在layui tab控件中载入外部html页面的方法
Sep 04 Javascript
vue导入.md文件的步骤(markdown转HTML)
Dec 31 Vue.js
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
解决GD中文乱码问题
2007/02/14 PHP
php 更新数据库中断的解决方法
2009/06/05 PHP
php 将excel导入mysql
2009/11/09 PHP
一步一步学习PHP(6) 面向对象
2010/02/16 PHP
CI框架源码阅读,系统常量文件constants.php的配置
2013/02/28 PHP
php实现比较两个字符串日期大小的方法
2015/05/12 PHP
php解决DOM乱码的方法示例代码
2016/11/20 PHP
PHP简单读取xml文件的方法示例
2017/04/20 PHP
Thinkphp3.2简单解决多文件上传只上传一张的问题
2017/09/26 PHP
Javascript 函数中的参数使用分析
2010/03/27 Javascript
js对象数组按属性快速排序
2011/01/31 Javascript
jQuery实现id模糊查询的小例子
2013/03/19 Javascript
JavaScript 动态加载脚本和样式的方法
2015/04/13 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
2015/09/07 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
2016/09/23 Javascript
微信小程序 css使用技巧总结
2017/01/09 Javascript
Javascript中字符串和数字的操作方法整理
2017/01/22 Javascript
vue Render中slots的使用的实例代码
2017/07/19 Javascript
echarts整合多个类似option的方法实例
2018/07/10 Javascript
Bootstrap模态对话框中显示动态内容的方法
2018/08/10 Javascript
js中innerText/textContent和innerHTML与target和currentTarget的区别
2019/01/21 Javascript
[51:27]LGD vs Liquid 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/19 DOTA
解析Python中的生成器及其与迭代器的差异
2016/06/20 Python
python3中os.path模块下常用的用法总结【推荐】
2018/09/16 Python
python实现Excel文件转换为TXT文件
2019/04/28 Python
Python 3 实现定义跨模块的全局变量和使用教程
2019/07/07 Python
白俄罗斯大卖场:21vek.by
2019/07/25 全球购物
英国顶尖手表珠宝品牌独家授权经销商:HS Johnson
2020/10/28 全球购物
安全检查与奖惩制度
2014/01/23 职场文书
工作决心书
2014/03/11 职场文书
2014年妇产科工作总结
2014/12/08 职场文书
收入证明申请书
2015/06/12 职场文书
2019年健身俱乐部的创业计划书
2019/08/26 职场文书
导游词之上海豫园
2019/10/24 职场文书
php 获取音视频时长,PHP 利用getid3 获取音频文件时长等数据
2021/04/01 PHP
css3 利用transform-origin 实现圆点分布在大圆上布局及旋转特效
2021/04/29 HTML / CSS