ES6学习笔记四:Proxy与Reflect
一:Proxy
代理。
ES6把代理模式做成了一个类,直接传入被代理对象、代理函数,即可创建一个代理对象,然后我们使用代理对象进行方法调用,即可调用被包装过的方法:
1)创建
var proxy = new Proxy(target, handler);
new Proxy()表示生成一个Proxy实例,target参数表示所要拦截的目标对象,handler参数也是一个对象,用来定制拦截行为,其中定义了一系列的代理方法。
如果handler没有设置任何拦截,那就等同于直接通向原对象。
2)handler中定义的拦截操作主要有:
1)get(target, propKey, receiver)
拦截对象属性的读取,比如proxy.foo和proxy['foo']。
最后一个参数receiver是一个对象,可选,参见下面Reflect.get的部分。
(2)set(target, propKey, value, receiver)
拦截对象属性的设置,比如proxy.foo = v或proxy['foo'] = v,返回一个布尔值。
(3)has(target, propKey)
拦截propKey in proxy的操作,返回一个布尔值。
(4)deleteProperty(target, propKey)
拦截delete proxy[propKey]的操作,返回一个布尔值。
(5)ownKeys(target)
拦截Object.getOwnPropertyNames(proxy)、Object.getOwnPropertySymbols(proxy)、Object.keys(proxy),返回一个数组。该方法返回目标对象所有自身的属性的属性名,而Object.keys()的返回结果仅包括目标对象自身的可遍历属性。
(6)getOwnPropertyDescriptor(target, propKey)
拦截Object.getOwnPropertyDescriptor(proxy, propKey),返回属性的描述对象。
(7)defineProperty(target, propKey, propDesc)
拦截Object.defineProperty(proxy, propKey, propDesc)、Object.defineProperties(proxy, propDescs),返回一个布尔值。
(8)preventExtensions(target)
拦截Object.preventExtensions(proxy),返回一个布尔值。
(9)getPrototypeOf(target)
拦截Object.getPrototypeOf(proxy),返回一个对象。
(10)isExtensible(target)
拦截Object.isExtensible(proxy),返回一个布尔值。
(11)setPrototypeOf(target, proto)
拦截Object.setPrototypeOf(proxy, proto),返回一个布尔值。
如果目标对象是函数,那么还有两种额外操作可以拦截。
(12)apply(target, object, args)
拦截 Proxy 实例作为函数调用的操作,call和apply操作。,比如proxy(...args)、proxy.call(object, ...args)、proxy.apply(...)。
(13)construct(target, args)
拦截 Proxy 实例作为构造函数调用的操作,比如new proxy(...args)。
二:Reflect
Reflect对象的方法与Proxy对象的方法一一对应,只要是Proxy对象的方法,就能在Reflect对象上找到对应的方法。
说白了,Reflect.XX 就是被代理的方法。
我们在proxy中使用Reflect.XX调用原本要调用的操作,然后在此前后定义一些代理操作,就形成了代理方法。
var loggedObj = new Proxy(obj, {
  get(target, name) {
    console.log('get', target, name);
    return Reflect.get(target, name);//调用对target对象的原本操作
  },
  deleteProperty(target, name) {
    console.log('delete' + name);
    return Reflect.deleteProperty(target, name);
  },
  has(target, name) {
    console.log('has' + name);
    return Reflect.has(target, name);
  }
});
Reflect可调用的方法:
- Reflect.apply(target,thisArg,args):
- Reflect.construct(target,args)
- Reflect.get(target,name,receiver)
- Reflect.set(target,name,value,receiver)
- Reflect.defineProperty(target,name,desc)
- Reflect.deleteProperty(target,name)
- Reflect.has(target,name)
- Reflect.ownKeys(target)
- Reflect.isExtensible(target)
- Reflect.preventExtensions(target)
- Reflect.getOwnPropertyDescriptor(target, name)
- Reflect.getPrototypeOf(target)
- Reflect.setPrototypeOf(target, prototype)
ES6学习笔记四:Proxy与Reflect的更多相关文章
- ES6学习笔记<四> default、rest、Multi-line Strings
		default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ... 
- ES6学习笔记(11)----Proxy
		参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Proxy1.概述 Proxy可以用来修改对象的默认操作 let obj = {na ... 
- ES6学习笔记四(类和对象)
		{ // 构造函数和实例 class Parent{ constructor(name='mukewan'){ this.name=name; } } let v_parent=new Parent( ... 
- ES6学习笔记<五> Module的操作——import、export、as
		import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ... 
- ES6学习笔记<三> 生成器函数与yield
		为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ... 
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
		接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ... 
- ES6学习笔记<一>  let const class extends super
		学习参考地址1 学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ... 
- JS&ES6学习笔记(持续更新)
		ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ... 
- es6学习笔记-class之一概念
		前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ... 
随机推荐
- SharePoint Online 创建资产库
			前言 本文介绍如何在Office 365中创建资产库库,以及资产库的一些基本设置. 正文 通过登录地址登录到Office 365的SharePoint Online站点中,我们可以在右上角的设置菜单中 ... 
- Google SRE 读书笔记 扒一扒SRE用的那些工具
			写在前面 最近花了一点时间阅读了<SRE Goolge运维解密>这本书,对于书的内容大家可以看看豆瓣上的介绍.总体而言,这本书是首次比较系统的披露Google内部SRE运作的一些指导思想. ... 
- Greenplum入门——基础知识、安装、常用函数
			Greenplum入门——基础知识.安装.常用函数 2017年10月08日 22:03:09 在咖啡里溺水的鱼 阅读数:8709 版权声明:本文为博主原创,允许非商业性质转载但请注明原作者和出处 ... 
- 【BZOJ】【4152】【AMPZZ2014】The Captain
			最短路 题解:http://zyfzyf.is-programmer.com/posts/97953.html 按x坐标排序,相邻点之间连边.满足dist(x1,x3)<=dist(x1,x2) ... 
- mysqlpump:更加合理的mysql数据库逻辑备份工具
			端看参见就知道了! E:\mysql-8.0.12-winx64>mysqlpump --helpmysqlpump Ver 8.0.12 for Win64 on x86_64 (MySQL ... 
- CSS-图片不变形设置
			不管网页做的美还是丑,有一个问题始终是无法躲避的,就是有的时候会遇到图片变形的问题,之前遇到过这种问题解决过,不过还是整体的重新研究了一下图片,其中主要涉及到的知识点就是max-width和max-h ... 
- Recover Binary Search Tree leetcode java
			题目: Two elements of a binary search tree (BST) are swapped by mistake. Recover the tree without chan ... 
- javascript this详解 面向对象
			在面向对象编程语言中,对于this关键字我们是非常熟悉的.比如C++.C#和Java等都提供了这个关键字 虽然在开始学习的时候觉得比较难,但只要理解了,用起来是非常方便和意义确定的.JavaS ... 
- SQL Server 2005 Integration Services (SSIS)数据源之MySQL
			一安装MySQL数据库的ODBC驱动 下载MySQL Connector ODBC 3.51.rar 单击setup按默认安装即可! 如下图所示,在ODBC数据源管理器中看到“MySQL ODBC 3 ... 
- Redis学习手册(主从复制)(转)
			一.Redis的Replication: 这里首先需要说明的是,在Redis中配置Master-Slave模式真是太简单了.相信在阅读完这篇Blog之后你也可以轻松做到.这里我们还是先列出一些理论性的 ... 
