深入理解ES6之——代理和反射(proxy)
通过调用new proxy()你可以创建一个代理来替代另一个对象(被称为目标),这个代理对目标对象进行了虚拟,因此该代理与该目标对象表面上可以被当做同一个对象来对待。
创建一个简单的代理
当你使用Proxy构造器来创建一个代理时,需要传递两个参数:目标对象以及一个处理器,后者是定义了一个或多个陷阱函数的对象。如果未提供陷阱函数,代理会对所有操作采取默认行为。
使用set陷阱函数验证属性值
let target = {};
var proxy = new Proxy(target, {
set(trapTarget, key, value, receiver) {
if (!trapTarget.hasOwnProperty(key)) {
if (isNaN(value)) {
throw new Error('Proxy must be a number');
}
}
return Reflect.set(trapTarget, key, value, receiver);
}
})
proxy.count = 1;
console.log(proxy.count);
console.log(target.count);
try {
proxy.anthorName = 'cc';
} catch (err) {
console.log(err.message);
}
使用上述方法可以对添加给对象的属性值进行验证,如果值为非数字,就会抛出错误。
使用get陷阱函数进行对象外形验证
在js中,如果读取一个对象中不存在的属性时,会显示undefined,这对于排查问题很不利。使用代理进行对象外形验证就可以帮你从这个错误中拯救出来。
let proxy = new Proxy({}, {
get(trapTarget, key, receiver) {
if (!(key in receiver)) {
throw new Error(`property ${key} not exist`);
}
return Reflect.get(trapTarget, key, receiver);
}
})
proxy.name = 'cc';
try {
console.log(proxy.age);
} catch (error) {
console.log(error.message);
}
//输出结果
property age not exist
上述代码对打印的对象属性进行验证,如果不存在则抛出一个错误。今日头条的一个面试题
使用has陷阱函数隐藏属性
in运算符用于判断指定对象中是否存在某个属性,如果对象的属性名与指定的字符串或符号值相匹配,那么in运算符应当返回true,无论该属性是对象自身的属性还是原型的属性。代理允许你使用has陷阱函数来解决这个问题
has陷阱函数会在使用in运算符的情况下被调用,并且会被传入两个参数:
- trapTarget:需要读取属性的对象(即代理的目标对象)
- key:需要检查的属性的键(字符串类型或符号类型)Reflect.has()方法接收与之相同的参数并向in运算符返回默认相应结果
let target = {
name: 'cc',
age: 26,
sex: 'man'
}
let proxy = new Proxy(target, {
has(trapTarget, key) {
if (trapTarget.hasOwnProperty(key)) {
return Reflect.has(trapTarget, key);
} else {
return false;
}
}
})
console.log('toString' in proxy);
console.log('name' in proxy);
console.log('age' in proxy);
使用deleteProperty陷阱函数避免属性被删除
delete运算符能从指定对象上删除一个属性,在删除成功时返回true,否则返回false
deleteProperty陷阱函数会在使用delete运算符去删除对象属性时被调用,并且会被传入两个参数:
- trapTarget:需要删除属性的对象
- key:需要删除的属性的键
Reflect.deleteProperty()方法也接受两个参数,并提供了deleteProperty陷阱函数的默认实现。
let target = {
name: 'target',
value: 42
}
let proxy = new Proxy(target, {
deleteProperty(trapTarg, ke) {
if (ke === 'value') {
return false;
} else {
return Reflect.deleteProperty(trapTarg, ke);
}
}
})
let result = delete proxy.value;
let result1 = delete proxy.name;
console.log(result);
console.log(result1);
我的博客即将同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=2n9b6sotx9wkc
深入理解ES6之——代理和反射(proxy)的更多相关文章
- 【读书笔记】【深入理解ES6】#12-代理(Proxy)和反射(Reflection)API
代理(Proxy)是一种可以拦截并改变底层JavaScript引擎操作的包装器,在新语言中通过它暴露内部运作的对象,从而让开发者可以创建内建的对象. 数组问题 在ECMAScript6出现之前,开发者 ...
- 【ES6】改变 JS 内置行为的代理与反射
代理(Proxy)可以拦截并改变 JS 引擎的底层操作,如数据读取.属性定义.函数构造等一系列操作.ES6 通过对这些底层内置对象的代理陷阱和反射函数,让开发者能进一步接近 JS 引擎的能力. 一.代 ...
- Java提高班(六)反射和动态代理(JDK Proxy和Cglib)
反射和动态代理放有一定的相关性,但单纯的说动态代理是由反射机制实现的,其实是不够全面不准确的,动态代理是一种功能行为,而它的实现方法有很多.要怎么理解以上这句话,请看下文. 一.反射 反射机制是 Ja ...
- ES6躬行记(24)——代理和反射
代理和反射是ES6新增的两个特性,两者之间是协调合作的关系,它们的具体功能将在接下来的章节中分别讲解. 一.代理 ES6引入代理(Proxy)地目的是拦截对象的内置操作,注入自定义的逻辑,改变对象的默 ...
- 设计模式-代理模式(Proxy Model)
文 / vincentzh 原文连接:http://www.cnblogs.com/vincentzh/p/5988145.html 目录 1.写在前面 2.概述 3.目的 4.结构组成 5.实现 5 ...
- JAVA设计模式(09):结构化-代理模式(Proxy)
一,定义: 代理模式(Proxy):为其它对象提供一种代理以控制对这个对象的訪问. 二.其类图: 三,分类一:静态代理 1,介绍:也就是须要我们为目标对象编写一个代理对象,在编译期就生成了这个代理对 ...
- 深入理解 Java 动态代理机制
Java 有两种代理方式,一种是静态代理,另一种是动态代理.对于静态代理,其实就是通过依赖注入,对对象进行封装,不让外部知道实现的细节.很多 API 就是通过这种形式来封装的. 代理模式结构图(图片来 ...
- 动态代理:JDK原生动态代理(Java Proxy)和CGLIB动态代理原理+附静态态代理
本文只是对原文的梳理总结,以及自行理解.自己总结的比较简单,而且不深入,不如直接看原文.不过自己梳理一遍更有助于理解. 详细可参考原文:http://www.cnblogs.com/Carpenter ...
- 【java项目实战】代理模式(Proxy Pattern),静态代理 VS 动态代理
这篇博文,我们主要以类图和代码的形式来对照学习一下静态代理和动态代理.重点解析各自的优缺点. 定义 代理模式(Proxy Pattern)是对象的结构型模式,代理模式给某一个对象提供了一个代理对象,并 ...
随机推荐
- C语言指针使用不当带来的内存不可读
前几天遇到一个C语言初学者提到的一个问题,代码我做了一些修改,如下: #include <stdio.h> #include <string.h> int main(void) ...
- Spring Cloud使用Zuul网关时报错
当开启了Eureka集群后,每创建一个服务都要往这两个集群中进行注册否则访问时会产生500
- ZIP:GZIP
GZIPInputStream: GZIPInputStream(InputStream in) :使用默认缓冲区大小创建新的输入流. GZIPInputStream(InputStream in, ...
- VS2010中GetMenu()和GetSubMenu(0)为NULL引发异常的解决方法 及添加方法
对于前面问题的分析:来源于http://blog.163.com/yuyang_tech/blog/static/216050083201211144120401/ 解决方法1: //来源:http: ...
- 异步编程之Async,Await和ConfigureAwait的关系
在.NET Framework 4.5中,async / await关键字已添加到该版本中,简化多线程操作,以使异步编程更易于使用.为了最大化利用资源而不挂起UI,你应该尽可能地尝试使用异步编程.虽然 ...
- ieda使用 在jsp页面中,有时候会出现不能智能显示方法 idea pageContext.setAttribute
idea使用,出现问题记录: 就比如在 pageContext.setAttribute("user",u);这句打pageContext会智能提示, 但是后面的setAttrib ...
- 机器学习-利用pickle加载cifar文件
首先这里有百度云的数据集供大家下载:(官网太慢了) 链接:https://pan.baidu.com/s/1G0MxZIGSK_DyZTcuNbxraQ 提取码:ui51 复制这段内容后打开百度网盘手 ...
- 使用java Apache poi 根据word模板生成word报表
项目开发过程中,客户提出一堆导出报表的需求,需要导出word格式,页眉还需要加上客户公司的logo,试了几种方案,最后选择了用 Apache poi 加上自定义标签的方式实现. 目前功能还比较简单,一 ...
- File文件类
目录 File文件类 File类的构造方法 File类的创建功能 File类的重命名 File类的删除功能 File类的判断功能 File类的获取功能 文件名称过滤器 File文件类 File:文件和 ...
- mysql整数类型int后面的长度有什么意义
int 的 SQL-92 同义字为 integer.SQL-92 是数据库的一个标准. int类型的存储大小为4个字节 unsigned(无符号) int 存储范围是 2^4*8 int(M) 中的M ...