目录：
  • 介绍代理
  • 代理的使用
  • 实例方法详解
  • 使用场景

代理（Proxy）：

可以对目标进行拦截，然后通过代理对象进行操作。

代理就像基金，是找一个代理人帮你投资，而不是自己操作，而ES6中的代理也是如此。

如何使用？

Proxy由目标对象(target)和对目标的具体行为(handler)组成。

 let target = {}
 let handler = {
   get(target, name) {
     if (target.hasOwnProperty(name)) {
       return target[name];
       } else {
       return "Without this attribute!";
     }
   },
   set(target, name, value) {
     return target[name] = value;
   }
 }

 let proxy = new Proxy(target, handler)
 ="swiftslee";
 console.log()//swiftslee
 console.log(proxy.age)//Without this attribute!

例如以上，我们定义了一个空对象进行代理，在代理操作中我们定义了getter和setter。对于没有的属性，我们返回字符串，否则返回值。

主要方法：
  • get()
  • set()
  • has()
  • deleteProperty()
  • apply()
  • ......还要其他属性，在此就不一一介绍了。
主要方法详解：
  • get()：拦截访问对象属性的请求，参数一表示目标对象，参数二表示访问的属性。
 let proxy = new Proxy({}, {
   get(target, name) {
     return 100;
 }
 })
 console.log(proxy.x);//100
 console.log(proxy.y);//100
 console.log(proxy.z);//100

无论访问任何属性，都返回100。

  • set()：拦截设置对象属性的请求，参数一为目标对象，参数二为访问属性，参数三为属性值。
 let proxy = new Proxy({}, {
   set(target, name, value) {
     return target[name] = `*${value}`
 }
 })
 proxy.x = 1;
 proxy.y = 2;
 console.log(proxy.x);//*1
 console.log(proxy.y);//*2

设置任何属性在前面都加一个*。

  • has()：拦截判断对象是否有某个属性，参数一为目标对象，参数二为访问属性。
 has(target, name) {
 if (name === "name") {
 return false;
 }
 return name in target;
 }
 })

  = "swiftslee";
 proxy.x = 1;
 console.log('name' in proxy);//false
 console.log('x' in proxy);//true
 console.log('y' in proxy);//false

返回一个布尔值，当属性为name时返回false，否则返回属性是否存在。

  • deleteProperty()：拦截删除操作，参数一为目标对象，参数二为访问属性。
 let proxy = new Proxy({}, {
 deleteProperty(target, name) {
 if (name === "name") {
 console.log("This attribute cannot be deleted")
 return false;
 }
 delete target[name];
 }
 })
  = "swiftslee";
 proxy.x = 1;
 delete ;//This attribute cannot be deleted
 delete proxy.x;
 console.log()//swiftslee
 console.log(proxy.x)//undefined

当属性为name时不可删除，否则删除属性。

  • apply():拦截函数的调用、call和apply操作。参数一表示目标对象，参数二表示this,参数三表示参数数组。
 let proxy = new Proxy((num) => {
 	return num;
 }, {
 	apply(target, ctx, args) {
 	  return "fun";
 }
 })
 console.log(proxy(1));//fun

拦截函数调用，并返回fun。

代理有什么用？

  • 设置私有属性
  • 阻止修改
  • 阻止删除
  • 属性访问
  • .....

代理就像给目标对象找了一个经纪人，开发者可以实现很多想要的场景来拦截操作和限制操作。

更多内容请看：IFTS