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 相关文章推荐
用ASP将SQL搜索出来的内容导出为TXT的代码
Jul 27 Javascript
js打开新窗口方法整理
Feb 17 Javascript
浅谈JavaScript Math和Number对象
Jan 26 Javascript
javascript实现的登陆遮罩效果汇总
Nov 09 Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
May 16 Javascript
关于Vue.js 2.0的Vuex 2.0 你需要更新的知识库
Nov 30 Javascript
AngularJS封装指令方法详解
Dec 12 Javascript
javascript中this关键字详解
Dec 12 Javascript
详解JSON Web Token 入门教程
Jul 30 Javascript
在Echarts图中给坐标轴加一个标识线markLine
Jul 20 Javascript
vue抽出组件并传值实例
Jul 31 Javascript
JS数据类型分类及常用判断方法
Nov 19 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 setcookie() cannot modify header information 的解决方法
2009/01/09 PHP
php ss7.5的数据调用 (笔记)
2010/03/08 PHP
分享一则PHP定义函数代码
2015/02/26 PHP
实例讲解PHP表单处理
2019/02/15 PHP
PHP 计算两个时间段之间交集的天数示例
2019/10/24 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
Jquery 基础学习笔记
2009/05/29 Javascript
网页中的图片的处理方法与代码
2009/11/26 Javascript
一些实用的jQuery代码片段收集
2011/07/12 Javascript
Chosen 基于jquery的选择框插件使用方法
2012/05/30 Javascript
Js调用Java方法并互相传参的简单实例
2016/08/11 Javascript
Yarn的安装与使用详细介绍
2016/10/25 Javascript
DropDownList控件绑定数据源的三种方法
2016/12/24 Javascript
深入浅析Node.js单线程模型
2017/07/10 Javascript
angular2 组件之间通过service互相传递的实例
2018/09/30 Javascript
vue实现整屏滚动切换
2020/06/29 Javascript
[44:43]完美世界DOTA2联赛决赛日 FTD vs GXR 第一场 11.08
2020/11/11 DOTA
python获取目录下所有文件的方法
2015/06/01 Python
Python的Django框架中URLconf相关的一些技巧整理
2015/07/18 Python
用Python写王者荣耀刷金币脚本
2017/12/21 Python
python爬虫的数据库连接问题【推荐】
2018/06/25 Python
python实现排序算法解析
2018/09/08 Python
python实现一行输入多个值和一行输出多个值的例子
2019/07/16 Python
使用 Python 写一个简易的抽奖程序
2019/12/08 Python
Canvas 帧动画吃苹果小游戏
2020/08/05 HTML / CSS
轻金属冶金专业毕业生自荐信
2013/11/02 职场文书
大学自我鉴定范文
2013/12/26 职场文书
运动会入场词60字
2014/02/15 职场文书
办公设备采购方案
2014/03/16 职场文书
防邪知识进家庭活动方案
2014/08/26 职场文书
客服专员岗位职责范本
2015/04/07 职场文书
2015年维修工作总结
2015/04/25 职场文书
2016教师读书思廉心得体会
2016/01/23 职场文书
Python爬虫进阶之Beautiful Soup库详解
2021/04/29 Python
MySQL中varchar和char类型的区别
2021/11/17 MySQL
Vue提供的三种调试方式你知道吗
2022/01/18 Vue.js