proxy用法

// 代理
{
let obj={
time:'2017-03-11',
name:'net',
_r:
}; let monitor=new Proxy(obj,{
// 拦截对象属性的读取
get(target,key){
return target[key].replace('','') //将目标对象中的2017都换成2018
},
// 拦截对象设置属性
set(target,key,value){
if(key==='name'){
return target[key]=value; //当key值为name时会被修改value值
}else {
return target[key];
}
},
// 拦截key in object操作判断是否属于object的某个属性
has(target,key){
if(key==='name'){
return target[key]
}else {
return false;
}
},
// 拦截delete
deleteProperty(target,key){
if(key.indexOf('_') > -){
delete target[key];
return true;
}else {
return target[key]
}
},
// 保护属性 拦截Object.keys,Object.getOwnPropertySymbols,Object.getOwnPropertyNames
ownKeys(target){
return Object.keys(target).filter(item=>item!='time')
}
}); console.log('get',monitor.time); monitor.time='';
monitor.name='mukewan';
console.log('set',monitor.time,monitor); //set 2018-03-11 Proxy {time: "2017-03-11", name: "mukewan", _r: 123} console.log('has','name' in monitor,'time' in monitor); //true false // delete monitor.time;
// console.log('delete',monitor); //还是存在,没被删掉 // delete monitor.time;
// console.log('delete',monitor); // delete monitor._r这一项;
// console.log('delete',monitor); //发现被删除了_r这一项 console.log('ownKeys',Object.keys(monitor)); //["name", "_r"] time被保护
}

Reflect

Reflect用法跟Proxy一样,他有的方法他都有,使用起来更简单

{
let obj={
time:'2017-03-11',
name:'net',
_r:
};
console.log('Reflect get',Reflect.get(obj,'time'));
Reflect.set(obj,'name','mukewan');
console.log(obj);
console.log('has',Reflect.has(obj,'name'));
}

应用场景 数据校验

{
function validator(target,validator){
return new Proxy(target,{
_validator:validator,
set(target,key,value,proxy){
if (target,key,value,proxy) {
let va=this._validator[key];
if(!!va(value)){
return Reflect.set(target,key,value,proxy)
}else {
throw Error(`不能设置${key}到${value}`)
}
}else {
throw Error(`${key} 不存在`)
}
}
})
} const personValidators={
name(val){
return typeof val==='string'
},
age(val){
return typeof val ==='number' &&val>
},
mobile(val) { }
} class Person {
constructor(name,age){
this.name=name;
this.age=age;
return validator(this,personValidators)
}
} const person=new Person('lilei',);
console.log(person);
person.name='Han mei mei'; console.log(person);
}

ES6学习笔记三(proxy和reflect)的更多相关文章

  1. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

  2. ES6学习笔记(11)----Proxy

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Proxy1.概述    Proxy可以用来修改对象的默认操作    let obj = {na ...

  3. ES6学习笔记三:Symbol、Set、Map

    一:Symbol ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值.它是 JavaScript 语言的第七种数据类型,前六种是:undefined.null.布尔值(Boolean). ...

  4. ES6学习笔记(三)——数值的扩展

    看到这条条目录有没有感觉很枯燥,觉得自己的工作中还用不到它所以实在没有耐心看下去,我也是最近得闲,逼自己静下心来去学习去总结,只有在别人浮躁的时候你能静下心来去学去看去总结,你才能进步.毕竟作为前端不 ...

  5. ES6学习笔记三

    1.Symbol ES5 的对象属性名都是字符串,这容易造成属性名的冲突.如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突.这就是 ES6 引入Symbol的原因 ...

  6. ES6学习笔记<五> Module的操作——import、export、as

    import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...

  7. ES6学习笔记<四> default、rest、Multi-line Strings

    default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...

  8. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  9. ES6学习笔记<一> let const class extends super

    学习参考地址1  学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...

随机推荐

  1. Linux top、VIRT、RES、SHR、SWAP(S)、DATA Memory Parameters Detailed

    catalog . Linux TOP指令 . VIRT -- Virtual Image (KB) . RES -- Resident size (KB) . SHR -- Shared Memor ...

  2. 【JS】JavaScript中Null和undefind区别

    1.undefined:只有一个值,及特殊的undefined.在使用var声明变量但未对其初始化时,这个变量的值是undefined,简言之,undefined就是表示变量申明了但未初始化时的值. ...

  3. Java Web之Servlet的三大作用域对象

    Servlet的作用域是干嘛的?答案就是共享数据而存在的,如图: 下面通过代码演示来具体讲解一下三大作用域 我们新建两个类 package main.com.vae.scope; import jav ...

  4. 为什么要两次调用encodeURI来解决乱码问题

    .encodeURL函数主要是来对URI来做转码,它默认是采用的UTF-8的编码.. UTF-8编码的格式:一个汉字来三个字节构成,每一个字节会转换成16进制的编码,同时添加上%号. 假设页面端输入的 ...

  5. C#设计模式(11)——装饰者模式

    1.装饰者模式介绍 装饰者顾名思义就是对一个类添加一些额外的装饰(功能).我们想给一个对象添加一些额外的功能又不改变对象内方法的签名怎么做呢?最常用的方法就是继承了,子类继承父类,然后重写父类的方法. ...

  6. VS2015快捷键大全

    Ctrl+E,D —-格式化全部代码 Ctrl+E,F —-格式化选中的代码 CTRL + SHIFT + B生成解决方案 CTRL + F7 生成编译 CTRL + O 打开文件 CTRL + SH ...

  7. 【1】【leetcode-130】 被围绕的区域

    (DFS思路对,写复杂了) 给定一个二维的矩阵,包含 'X' 和 'O'(字母 O). 找到所有被 'X' 围绕的区域,并将这些区域里所有的 'O' 用 'X' 填充. 示例: X X X X X O ...

  8. HDU 1020(连续同字符统计 **)

    题意是要统计在一段字符串中连续相同的字符,不用再排序,相等但不连续的字符要分开输出,不用合在一起,之前用了桶排序的方法一直 wa,想复杂了. 代码如下: #include <bits/stdc+ ...

  9. 转载--关于hdfs

    原文章链接 你肯定听过Hadoop,对就是那头奔跑的小象. 图片描述 Hadoop作为大数据时代代表性的解决方案被大家所熟知,它主要包含两部分内容: HDFS分布式文件存储 MapReduce分布式计 ...

  10. [Windows] [VS] [C] [取得指针所指内存的十六进制形式字符串]

    接口定义如下: #include <Windows.h> // 取得指针所指内存的十六进制形式字符串,size指定字节长度 #define Mem_toString(address, si ...