浅谈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 相关文章推荐
JS维吉尼亚密码算法实现代码
Nov 09 Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 Javascript
js关于字符长度限制的问题示例探讨
Jan 24 Javascript
一段非常简单的js判断浏览器的内核
Aug 17 Javascript
原生javascript实现隔行换色
Jan 04 Javascript
jQuery应用之jQuery链用法实例
Jan 19 Javascript
jQuery中ajax的load()与post()方法实例详解
Jan 05 Javascript
js弹出框、对话框、提示框、弹窗实现方法总结(推荐)
May 31 Javascript
js图片轮播手动切换特效
Jan 12 Javascript
详解Angular2表单-模板驱动的表单(Template-Driven Forms)
Aug 04 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
Oct 28 Javascript
vue/cli 配置动态代理无需重启服务的方法
May 20 Vue.js
使用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获取某个目录大小的代码
2008/09/10 PHP
php批量更改数据库表前缀实现方法
2013/10/26 PHP
php实现webservice实例
2014/11/06 PHP
浅谈COOKIE和SESSION区别
2015/07/19 PHP
8个必备的PHP功能开发
2015/10/02 PHP
CI框架整合widget(页面格局)的方法
2016/05/17 PHP
PHP中串行化用法示例
2016/11/16 PHP
JS target与currentTarget区别说明
2011/08/28 Javascript
Extjs改变树节点的勾选状态点击按钮将复选框去掉
2013/11/14 Javascript
鼠标选择动态改变网页背景颜色的JS代码
2013/12/10 Javascript
FireBug 调试JS入门教程 如何调试JS
2013/12/23 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
javascript实现根据时间段显示问候语的方法
2015/06/18 Javascript
js实现兼容性好的微软官网导航下拉菜单效果
2015/09/07 Javascript
原生JS取代一些JQuery方法的简单实现
2016/09/20 Javascript
jquery实现自定义图片裁剪功能【推荐】
2017/03/08 Javascript
nodejs+websocket实时聊天系统改进版
2017/05/18 NodeJs
Bootstrap按钮组实例详解
2017/07/03 Javascript
浅谈mint-ui 填坑之路
2017/11/06 Javascript
javascript函数的节流[throttle]与防抖[debounce]
2017/11/15 Javascript
微信小程序上传多图到服务器并获取返回的路径
2019/05/05 Javascript
JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】
2019/07/11 jQuery
微信小程序 子级页面返回父级并把子级参数带回父级实现方法
2019/08/22 Javascript
Vue 实现一个命令式弹窗组件功能
2019/09/25 Javascript
vue Tab切换以及缓存页面处理的几种方式
2019/11/05 Javascript
JS面向对象之单选框实现
2020/01/17 Javascript
node.js使用stream模块实现自定义流示例
2020/02/13 Javascript
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
利用Psyco提升Python运行速度
2014/12/24 Python
Python无损音乐搜索引擎实现代码
2018/02/02 Python
Python理解递归的方法总结
2019/01/28 Python
tensorflow 报错unitialized value的解决方法
2020/02/06 Python
python2和python3哪个使用率高
2020/06/23 Python
婚纱摄影师求职信范文
2014/04/17 职场文书
煤矿安全承诺书
2014/05/22 职场文书
通知的格式范文
2015/04/27 职场文书