昨天在和群友讨论时遇到一题是这样的。

题目描述

//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的更多相关文章

  1. [每日一题]面试官问:谈谈你对ES6的proxy的理解?

    [每日一题]面试官问:谈谈你对ES6的proxy的理解? 关注「松宝写代码」,精选好文,每日一题 作者:saucxs | songEagle 一.前言 2020.12.23 日刚立的 flag,每日一 ...

  2. 山东省第七届ACM竞赛 C题 Proxy (Dijkstra算法,单源路径最短问题)

    题意:给定0-n+1个点,和m条边,让你找到一条从0到n+1的最短路,输出与0相连的结点... 析:很明显么,是Dijkstra算法,不过特殊的是要输出与0相连的边,所以我们倒着搜,也是从n+1找到0 ...

  3. Tomcat 下配置OpenLayers proxy.cgi代理

    摘要:在OpenLayers访问WFS服务时,会遇到跨域的问题而导致服务无法访问.此时,需要在应用程序中设置代理,通过代理进行访问.本文介绍在tomcat进行proxy.cgi文件配置,以及在调用代理 ...

  4. Spock Proxy

    Spock Proxy undefined 服务网关_百度搜索 undefined 8月2日,深圳 | DockOne技术沙龙开始报名啦 - DockOne.io undefined 知道创宇爬虫题- ...

  5. java面试题及答案(基础题122道,代码题19道)

    JAVA相关基础知识 1.面向对象的特征有哪些方面 1.抽象: 抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面.抽象并不打算了解全部问题,而只是选择其中的一部分, ...

  6. java面试基础题(三)

    程序员面试之九阴真经 谈谈final, finally, finalize的区别: final:::修饰符(关键字)如果一个类被声明为final,意味着它不能再派生出新的子类,不能作为父类被继承.因此 ...

  7. python315题

    目录 Python基础篇 1:为什么学习Python 2:通过什么途径学习Python 3:谈谈对Python和其他语言的区别 Python的优势: 4:简述解释型和编译型编程语言 5:Python的 ...

  8. 关于第一场HBCTF的Web题小分享,当作自身的笔记

    昨天晚上6点开始的HBCTF,虽然是针对小白的,但有些题目确实不简单. 昨天女朋友又让我帮她装DOTA2(女票是一个不怎么用电脑的),然后又有一个小白问我题目,我也很热情的告诉她了,哎,真耗不起. 言 ...

  9. ngx_lua学习笔记 -- capture + proxy 实现httpclient

    题注 最近我在学习nginx的lua插件,发现结合nginx的异步io和lua的流程控制能力,还是有很丰富的想象空间的:几乎所有常见的http请求的处理逻辑都能搞定,诸如查查数据库,访问一下memca ...

随机推荐

  1. C++ 类定义

    C++ 类定义 定义一个类,本质上是定义一个数据类型的蓝图.这实际上并没有定义任何数据,但它定义了类的名称意味着什么,也就是说,它定义了类的对象包括了什么,以及可以在这个对象上执行哪些操作. 类定义是 ...

  2. linux c语言开发工具

    ---恢复内容开始--- C语言编译全过程剖析 编译的概念:编译程序读取源程序(字符流),对之进行词法和语法的分析,将高级语言指令转换为功能等效的汇编代码,再由汇编程序转换为机器语言,并且按照操作系统 ...

  3. 6.短信验证码60s倒计时

    短信验证码60s倒计时 html: <input type="button"  class="btn btn-primary" value="免 ...

  4. 安装oracle经验

    1.使用database configuration assistant配置和创建数据库 2.使用net manager配置监听 3.使用netconfiguration assistant配置服务

  5. 14. Longest Common Prefix(暴力循环)

    Write a function to find the longest common prefix string amongst an array of strings. If there is n ...

  6. sitecore系列教程之目标功能有什么新意?

    由于SItecore 8中有很多令人兴奋的东西,我选择专注于体验平台的特定领域,这篇文章的主题是目标. 1.客户智能选项  目标项目(/ sitecore / system / Marketing C ...

  7. SQL query - check latest 3 days failed job.

    select top 100 js.last_run_date ,j.name, js.step_id,js.step_name,js.last_run_date,jsl.log,jh.message ...

  8. uva 10163 Storage Keepers

    题意: 有n个仓库,m个人,一个仓库只能由一个人托管,每个人可以托管多个仓库. 每个人有一个能力值a,如果说他托管了k个仓库,那么这些仓库的安全值都是a/k. 雇佣一个人的花费也是a. 如果一个仓库没 ...

  9. 2017-2018-1 20155228 《信息安全系统设计基础》第六周学习总结&课下作业

    20155228 2017-2018-1 <信息安全系统设计基础>第六周学习总结&课下作业 教材学习内容总结 异常及其种类 异常可以分为四类:中断(interrupt) ,陷阱(t ...

  10. redis启动

    在redis的安装目录的bin目录下: 1.启动服务(指定配置文件) ./redis-server redis.conf 2.启动客户端   ./redis-cli