ReflectionReflect当你看到一个新的API，不明白的时候，直接在浏览器里打印出来看看长什么样。反射的概念Reflect是一个内置对象，提供拦截JavaScript操作的方法。该方法与代理处理程序的方法相同。Reflect不是一个函数对象，所以它是不可构造的。newReflect()//写法错误反射的使用Reflect提供了一些静态方法。静态方法是指只能通过对象本身访问的方法。这些知识在前面的章节中已经解释过了。对所有方法的详细分析，请看Reflect详解。静态方法列表：静态方法那么多，你需要学会的是如何使用它们。1.Reflect.apply()2,Reflect.construct()3,Reflect.defineProperty()4,Reflect.deleteProperty()5,Reflect.enumerate()6,Reflect.get()7,Reflect.getOwnPropertyDescriptor()8,Reflect.getPrototypeOf()9,Reflect.has()10,Reflect.isExtensible()11,Reflect.ownKeys()12,Reflect.preventExtensions()13,Reflect.set()14,Reflect.setPrototypeOf()静态方法使用方法：demo1：使用Reflect.get()获取目标对象指定key的值。letobj={a:1};lets1=Reflect.get(obj,"a")console.log(s1)//1demo2：使用Reflect.apply向目标函数floor传递指定参数。consts2=Reflect.apply(Math.floor,undefined,[1.75]);console.log(s2)//1进一步理解Reflect看了上面的例子和方法，我们知道Reflect可以拦截JavaScript代码，包括拦截对象，拦截函数等，然后对Reflect进行读写等操作拦截的对象或函数。比如demo1的get()方法拦截obj对象，然后读取key为a的value。当然，a的值也可以不用反射读取。看demo2的apply()方法。你应该对这个方法有更好的理解。与在数组中使用apply的不同之处在于Reflect.apply()提供了3个参数。第一个参数为反射函数，后2个参数与数组的apply一致。demo2的例子可以理解为拦截Math.floor方法，然后传入参数，将返回值赋值给s2，这样我们需要读取返回值的时候就可以调用s2了。//数组使用applyconstarr=[1,2,3]functiona(){returnArray.concat.apply(null,arguments)}consts=a(arr)console.log(s)//[1,2,3]其实Reflect的作用类似于我们下面要讲的Proxy。ProxyProxyProxy这个词相信你已经听过无数遍了。曾经写过一篇文章说webpack使用proxy拦截指定域的API请求，转发到新的目标url。代理在webpack中使用。但是注意Proxy和proxy，大小写字母是不一样的。本章介绍以大写字母开头的Proxy。语法letp=newProxy(target,handler);target：一个目标对象（可以是任何类型的对象，包括原生数组、函数，甚至是另一个代理）被Proxy包裹起来。处理程序：一个对象，其属性是定义代理在执行操作时的行为的函数。Proxy使用基础demo：Proxy的demo很多，我们只分析基础demo，主要看newProxy({},handler)的操作，指定目标obj对象，然后handler对象执行get()操作,get()返回一个值判断是如果name是目标对象的属性，则返回target[name]的值，否则返回37。最后测试时，p.a是对象p的key，所以返回a的值，但p.b不存在，返回37。constobj={a:10}lethandler={get:function(target,name){控制台。log('test:',target,name)//test:{"a":10}a//test:{"a":10}breturnnameintarget?target[name]:37}}letp=newProxy(obj,handler)console.log(p.a,p.b)//1037这个例子的作用是拦截目标对象obj，在执行读写的时候obj的操作，进入handler函数进行判断，如果读取的key不存在则返回默认值。我们在使用一些http-proxy插件或者webpack的时候，有时候需要访问某个api的时候，会跳转到指定的url。这种方法也可以解决跨域访问。这种代理模式类似于Proxy代理。但是，不要混淆它。module.exports={devServer:{proxy:[{context:"/api/*",//代理APItarget:'https://www.hyy.com',//目标URLsecure:false}]}}小结不管是反射还是代理，除了使用的方法不同，做的事情都非常相似。它们可以理解为拦截一些东西，然后进行函数运算，然后返回函数运算的结果。大部分前端在日常业务需求中很少会用到这两个API，具体的使用场景还得在以后的开发中慢慢摸索。=>返回文章目录
