当前位置: 首页 > news >正文

es6的Proxy与Reflect

  1. Proxy是在对目标对象的读取时,架设一层拦截,可以在读取对象中的任意一个属性时做一些额外的操作

  2. Proxy与Object.defineProperty方式设置setter、getter方法不同的是,Proxy是对目标对象的整体拦截,而Object.defineProperty注重对对象中的单个属性拦截

    const obj = {a: 1,b: 2
    };
    // 向obj中添加属性d,并设置setter、getter拦截
    let _data = '默认值';
    Object.defineProperty(obj, 'd', {set(value) {console.log('来设置d属性值了');_data = value;},get() {console.log('来获取d属性值了');return _data;}
    });
    console.log(obj.a); // 1 (不会触发d属性的拦截器)
    console.log(obj.b); // 2 (不会触发d属性的拦截器)
    console.log(obj.d);
    obj.d = '3';
    

    在这里插入图片描述

    const obj1 = new Proxy(obj, {set(target, key, value) {console.log('来给obj对象的属性设置值了');Reflect.set(target, key, value);return true;},get(target, key) {console.log('来拿obj对象中的属性值了');return Reflect.get(target, key);}
    });
    console.log(obj1.a);
    console.log(obj1.b);
    console.log(obj1.d);
    obj1.a = 'hello';
    obj1.b = 'hi';
    obj1.d = 'world';
    

    在这里插入图片描述

http://www.lryc.cn/news/40499.html

相关文章:

  • Linux环境部署vue项目 + nginx访问(包含nginx配置简介)
  • 到底什么是跨域,如何解决跨域(常见的几种跨域解决方案)?
  • pm3包1.4版本发布----一个用于3组倾向性评分的R包
  • 没有关系的话,那就去建立关系吧
  • Vue项目
  • 【webrtc】ICE 到VCMPacket的视频内存分配
  • 进阶C语言——指针(二)【题目练习】
  • Ajax简介
  • ChatGPT 4 测试 两数比较大小问题。
  • SSM-CRUD整合视频教程:Spring、SpringMVC、MyBatis、bootstrap、pagehelper、JSR303后端校验
  • Linux常用命令——基于Ubuntu22.04
  • Sentinel
  • 再也不想去字节跳动面试了,6年测开面试遭到这样打击.....
  • 【深度解刨C语言】符号篇(全)
  • VS Code 将推出更多 AI 功能给 Java 开发者
  • 关于利用FFT分析时域信号幅相的思考与验证
  • 基于java中的Springboot框架实现餐厅点餐系统展示
  • 案例07-在线人员列表逻辑混乱
  • Java集合框架
  • 奇异值分解(SVD)原理与在降维中的应用
  • GDB调试程序
  • 五种IO模型
  • 5 全面认识java的控制流程
  • 第二章 测验【嵌入式系统】
  • 排序算法之插入排序
  • Kaggle实战入门:泰坦尼克号生生还预测
  • 【大汇总】11个Python开发经典错误(1)
  • Java中的异常
  • L2-022 重排链表 L2-002 链表去重
  • 【手撕八大排序】——插入排序