浅谈es6语法 (Proxy和Reflect的对比)


Posted in Javascript onOctober 24, 2017

如下所示:

{ 

 //原始对象
 let obj={
 time:'2017-03-11',
 name:'net',
 _r:123
 };
 //(代理商)第一个参数代理对象,第二个参数真正代理的东西
 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;
  }else{
  //不做操作直接返回
  return target[key];
  }
 },
 // 拦截key in object操作
 has(target,key){
  if(key==='name'){
  return target[key]
  }else{
  return false;
  }
 },
 // 拦截delete
 deleteProperty(target,key){
  if(key.indexOf('_')>-1){
  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); //2018-03-11
 //操作
 monitor.time='2018';
 monitor.name='mukewang';
 console.log('set',monitor.time,monitor);//2018-03-11;{time: "2017-03-11", name: "mukewang", _r: 123}

 console.log('has','name' in monitor,'time' in monitor);//true;false

 delete monitor.time;
 console.log('delete',monitor);//{time: "2017-03-11", name: "mukewang", _r: 123}
 //
 delete monitor._r;
 console.log('delete',monitor);//{time: "2017-03-11", name: "mukewang"}

 console.log('ownKeys',Object.keys(monitor));//["name", "_r"]

}

{
 let obj={
 time:'2017-03-11',
 name:'net',
 _r:123
 };

 console.log('Reflect get',Reflect.get(obj,'time'));//get 2017-03-11
 Reflect.set(obj,'name','mukewang');
 console.log(obj);//{time: "2017-03-11", name: "mukewang", _r: 123}
 console.log('has',Reflect.has(obj,'name'));//true
}

以上这篇浅谈es6语法 (Proxy和Reflect的对比)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 继承详解(四)
Jul 13 Javascript
纯js实现背景图片切换效果代码
Nov 14 Javascript
Wordpress ThickBox 添加“查看原图”效果代码
Dec 11 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
Javascript 闭包引起的IE内存泄露分析
May 23 Javascript
javascript随机显示背景图片的方法
Jun 18 Javascript
AngularJS指令用法详解
Nov 02 Javascript
扩展Bootstrap Tooltip插件使其可交互的方法
Nov 07 Javascript
jQuery基于排序功能实现上移、下移的方法
Nov 26 Javascript
javascript+html5+css3自定义提示窗口
Jun 21 Javascript
angular4自定义表单控件[(ngModel)]的实现
Nov 23 Javascript
Vue实现input宽度随文字长度自适应操作
Jul 29 Javascript
使用JQuery实现图片轮播效果的实例(推荐)
Oct 24 #jQuery
通俗易懂地解释JS中的闭包
Oct 23 #Javascript
AngularJS 教程及实例代码
Oct 23 #Javascript
浅谈Koa服务限流方法实践
Oct 23 #Javascript
浅谈vue中使用图片懒加载vue-lazyload插件详细指南
Oct 23 #Javascript
angularjs实现猜大小功能
Oct 23 #Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
Oct 23 #Javascript
You might like
php面向对象全攻略 (十六) 对象的串行化
2009/09/30 PHP
POSIX 风格和兼容 Perl 风格两种正则表达式主要函数的类比(preg_match, preg_replace, ereg, ereg_replace)
2010/10/12 PHP
PHP实现长文章分页实例代码(附源码)
2016/02/03 PHP
js下写一个事件队列操作函数
2010/07/19 Javascript
JS格式化数字金额用逗号隔开保留两位小数
2013/10/18 Javascript
Javascript setInterval的两种调用方法(实例讲解)
2013/11/29 Javascript
js输出阴历、阳历、年份、月份、周示例代码
2014/01/29 Javascript
JavaScript实现获得所有兄弟节点的方法
2015/07/23 Javascript
JQuery实现网页右侧随动广告特效
2016/01/17 Javascript
JavaScript计算器网页版实现代码分享
2016/07/15 Javascript
Bootstrap Table使用方法详解
2016/08/01 Javascript
微信小程序的动画效果详解
2017/01/18 Javascript
layui问题之模拟select点击事件的实例讲解
2018/08/15 Javascript
分享5个顶级的JavaScript Ajax组件库
2018/09/16 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
javascript实现简单搜索功能
2020/03/26 Javascript
Python基于time模块求程序运行时间的方法
2017/09/18 Python
今天 平安夜 Python 送你一顶圣诞帽 @微信官方
2017/12/25 Python
Django项目中用JS实现加载子页面并传值的方法
2018/05/28 Python
PyCharm-错误-找不到指定文件python.exe的解决方法
2019/07/01 Python
python之pymysql模块简单应用示例代码
2019/12/16 Python
解决python web项目意外关闭,但占用端口的问题
2019/12/17 Python
详解用python -m http.server搭一个简易的本地局域网
2020/09/24 Python
实现CSS3中的border-radius(边框圆角)示例代码
2013/07/19 HTML / CSS
荷兰时尚精品店:Labels Fashion
2020/03/22 全球购物
体育专业自荐书
2014/05/29 职场文书
物流专业专科生职业生涯规划书
2014/09/14 职场文书
关于十八大的演讲稿
2014/09/15 职场文书
2015年毕业生自我鉴定模板
2014/09/19 职场文书
行为规范主题班会
2015/08/13 职场文书
2016年小学感恩节活动总结
2016/04/01 职场文书
MySQL修改默认引擎和字符集详情
2021/09/25 MySQL
教你使用VS Code的MySQL扩展管理数据库的方法
2022/01/22 MySQL
Python字符串格式化方式
2022/04/07 Python
Flink 侧流输出源码示例解析
2022/09/23 Servers
Python sklearn分类决策树方法详解
2022/09/23 Python