题说proxy
昨天在和群友讨论时遇到一题是这样的。
题目描述
//Tomy非常敏感,不喜欢别人碰他的东西。一旦有人碰他就会大喊Don't Touch Me.
//完成tomy这个对象,禁止对tomy的内容进行修改(增加、修改、删除)
//一旦有人对tomy进行任何的修改,调用console.log打印Don't Touch Me
const tomy={
name:"lizhiqiang",
age:"23"
};
题目分析
刚开始我觉得可以通过es5中的defineProperty去定义访问器属性,当要修改tomy的属性时,就可以console.log信息出来。
可是这样的话无法做到当要删除属性时,以及要增加属性时,console.log信息。也就是说defineProperty提供给我们的权限还不够,我们需要更加底层的操作。
那么要怎么做呢?
只能使用ES6中的proxy来做啦。
题目要求我们在修改之前console信息,也就是需要我们拦截下修改操作,并在此之前console信息。
proxy简介
通过调用 new Proxy() ,你可以创建一个代理用来替代另一个对象(被称为目标),这个代理对目标对象进行了虚拟,因此该代理与该目标对象表面上可以被当作同一个对象来对待。
代理允许你拦截在目标对象上的底层操作,而这原本是 JS 引擎的内部能力。拦截行为使用了一个能够响应特定操作的函数(被称为陷阱)。
被 Reflect 对象所代表的反射接口,是给底层操作提供默认行为的方法的集合,这些操作是能够被代理重写的。每个代理陷阱都有一个对应的反射方法,每个方法都与对应的陷阱函数同名,并且接收的参数也与之一致。下表总结了这些行为:
好了,针对题目要求,我们只需要写代理陷阱set、deleteProperty就行。
代码
//Tomy非常敏感,不喜欢别人碰他的东西。一旦有人碰他就会大喊Don't Touch Me.
//完成tomy这个对象,禁止对tomy的内容进行修改(增加、修改、删除)
//一旦有人对tomy进行任何的修改,调用console.log打印Don't Touch Me
const tomy={
name:"lizhiqiang",
age:"23"
};
let tomyProxy=new Proxy(tomy,{
deleteProperty(trapTarget,key){
console.log("Don't Touch Me--delete "+key);
return false;
},
set(trapTarget, key, value, receiver) {
if (!trapTarget.hasOwnProperty(key)) {
console.log("Don't Touch Me--add "+key);
}else{
console.log("Don't Touch Me--update "+key);
}
return false;
}
});
console.log(tomyProxy);
Object.freeze(tomyProxy);
delete tomyProxy.age;//删除属性
console.log(tomyProxy);
tomyProxy.age=1;//修改属性
console.log(tomyProxy);
tomyProxy.phone="123456789";//增加属性
console.log(tomyProxy);
运行结果如下,可见这样是可行的。
其实es6的proxy和symbol还有很多值得深入学习的呀,以后会慢慢练习使用。
题说proxy的更多相关文章
- [每日一题]面试官问:谈谈你对ES6的proxy的理解?
[每日一题]面试官问:谈谈你对ES6的proxy的理解? 关注「松宝写代码」,精选好文,每日一题 作者:saucxs | songEagle 一.前言 2020.12.23 日刚立的 flag,每日一 ...
- 山东省第七届ACM竞赛 C题 Proxy (Dijkstra算法,单源路径最短问题)
题意:给定0-n+1个点,和m条边,让你找到一条从0到n+1的最短路,输出与0相连的结点... 析:很明显么,是Dijkstra算法,不过特殊的是要输出与0相连的边,所以我们倒着搜,也是从n+1找到0 ...
- Tomcat 下配置OpenLayers proxy.cgi代理
摘要:在OpenLayers访问WFS服务时,会遇到跨域的问题而导致服务无法访问.此时,需要在应用程序中设置代理,通过代理进行访问.本文介绍在tomcat进行proxy.cgi文件配置,以及在调用代理 ...
- Spock Proxy
Spock Proxy undefined 服务网关_百度搜索 undefined 8月2日,深圳 | DockOne技术沙龙开始报名啦 - DockOne.io undefined 知道创宇爬虫题- ...
- java面试题及答案(基础题122道,代码题19道)
JAVA相关基础知识 1.面向对象的特征有哪些方面 1.抽象: 抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面.抽象并不打算了解全部问题,而只是选择其中的一部分, ...
- java面试基础题(三)
程序员面试之九阴真经 谈谈final, finally, finalize的区别: final:::修饰符(关键字)如果一个类被声明为final,意味着它不能再派生出新的子类,不能作为父类被继承.因此 ...
- python315题
目录 Python基础篇 1:为什么学习Python 2:通过什么途径学习Python 3:谈谈对Python和其他语言的区别 Python的优势: 4:简述解释型和编译型编程语言 5:Python的 ...
- 关于第一场HBCTF的Web题小分享,当作自身的笔记
昨天晚上6点开始的HBCTF,虽然是针对小白的,但有些题目确实不简单. 昨天女朋友又让我帮她装DOTA2(女票是一个不怎么用电脑的),然后又有一个小白问我题目,我也很热情的告诉她了,哎,真耗不起. 言 ...
- ngx_lua学习笔记 -- capture + proxy 实现httpclient
题注 最近我在学习nginx的lua插件,发现结合nginx的异步io和lua的流程控制能力,还是有很丰富的想象空间的:几乎所有常见的http请求的处理逻辑都能搞定,诸如查查数据库,访问一下memca ...
随机推荐
- cocos2dx 3.x版本搭建Mac环境工程(创建一个新的C++工程)百分百可行
首先第一篇,想学cocos2dx第一步就是搭建环境,第一步搭建不了环境,创建不了工程那一切都是扯淡. 说到mac下安装cocos2d-x想到的模式就是xcode+cocos2d-x.因为我本身就是一个 ...
- Nuxtjs初始
今天去看vue的官网,才看了他的升级版-->Nuxtjs,https://nuxtjs.org/guide/installation可以点击链接进入他的官网查看文档 第一步,搭建项目之前的准备工 ...
- phpstudy的使用
1.第一步是下载phpstudy,你可以百度去下载,也可以通过下面我分享的网盘下载 链接:https://pan.baidu.com/s/1E_CXIrKv1N-jrlA4KCovZA 密码:mkx9 ...
- MFC AfxMessageBox MessageBox MessageBoxA 默认标题修改
在工程的资源里添加String Table资源,AFX_IDS_APP_TITLE,然后设置其值即可,AFX_IDS_APP_TITLE的值就是AfxMessageBox.MessageBox.Mes ...
- time_t time()
time_t atime, btime; time(&atime); btime = time(0); 两种方式效果一样.
- kali linux wmtools安装
1,选择挂载盘时选择自动检测 2,点击安裝vmware tools安裝 3.tar -xzf 壓縮包名 4../vmware-install.pl 5,reboot
- Codeforces Round #322 (Div. 2) E F
E. Kojiro and Furrari 题意说的是 在一条直线上 有n个加油站, 每加一单位体积的汽油 可以走1km 然后每个加油站只有一种类型的汽油,汽油的种类有3种 求从起点出发到达终点要求使 ...
- jQuery效果--show([speed,[easing],[fn]])和hide([speed,[easing],[fn]])
hide([speed,[easing],[fn]]) 概述 隐藏显示的元素 这个就是 'hide( speed, [callback] )' 的无动画版.如果选择的元素是隐藏的,这个方法将不会改变任 ...
- MySql 学习参考目录
[1]< MySql 数据类型> [2]< MySql 基础 > [3]< MySql 存储过程 > PS:个人认为,如上总结超值. Good Good Study ...
- 4.7 引入NULL对象
[1]引入NULL对象范例 Book.h #ifndef _BOOK_H #define _BOOK_H #include <string> using namespace std; cl ...