(精华)2020年7月5日 JavaScript高级篇 ES6(Proxy)

// let p = new Proxy(target,handel)
// tearget: 用Proxy包装的目标对象
// handel:一个对象proxy代理操作的对象
// ----------get用于对象属性读取的拦截 可以接收三个参数 目标对象 属性名 proxy实例本身(可选)------------------
// 判断一个对象的属性是否存在
let person = {
    name: 'tony'
}
let proxy = new Proxy(person, {
    get: function (target, property) {
        // console.log(target)
        // console.log(property)
        return target[property]
    }
})
console.log(proxy.name);
// ------------set 拦截对象赋值的操作 目标对象 属性名 属性值 proxy实例本身-------------
// 对对象赋值的年龄进行一个判断
let obj = {}
let setVid = {
    set: function (object, prop, value) {
        Reflect.set(object, prop, value)
    }
}
let p = new Proxy(obj, setVid)
p.age = 200
console.log(p.age);
//------------案例----------------
let handel = {
    get(target,key){
        console.log(key);
        if(key[0] === "_"){
            throw new Error('内部属性禁止外部访问')
        }
        return target[key]
    },
    set(target,key,value){
        target[key] = value
        // return true
    }
}
// 提示_属性是 内部属性禁止外部访问
let target = {}
let proxy = new Proxy(target,handel)
// --------------proxy设置删除操作 ------------------
let person = {name:'张三'}
let handel  = {
    deleteProperty(target,key){
       console.log('不允许删除属性');
       // 这里面删除才是真正可以删除
       delete target[key]
    }
}
let proxy = new Proxy(person,handel)
delete proxy.name
console.log(proxy.name);
// ----------------apply拦截 的是函数的调用-------------------
let target = function(){return '我是目标函数'}
let handel = {
    apply:function(){
        return '我是拦截你的'
    }
}
let p = new Proxy(target,handel)
console.log(p());
//--------------------has 拦截 是否有某个属性的 -----------------------
// has是否可以拦截原型上面的属性呢
// 可以隐藏我们的属性
let father = {
    name:'father'
}
let handel = {
    has(target,key){
        if(key[0] === '_'){
            return false;
        }
        return key in target
    }
}
let target = {_prop:'a',prop:'b'}
target.__proto__ = father
let proxy = new Proxy(target,handel)
console.log('_prop' in proxy);
console.log('name' in proxy);
// ------------------------------construct-----------------------------------
function Person(name){
    this.name = name
}
let person = new Person('tony')
let proxy = new Proxy(Person,{
    construct:function(target,key){
        return {name:'Chris'}
        // return 123
        // 返回的一定要是一个对象
    }
})
console.log(new proxy('张三').name);

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
  
28
  
29
  
30
  
31
  
32
  
33
  
34
  
35
  
36
  
37
  
38
  
39
  
40
  
41
  
42
  
43
  
44
  
45
  
46
  
47
  
48
  
49
  
50
  
51
  
52
  
53
  
54
  
55
  
56
  
57
  
58
  
59
  
60
  
61
  
62
  
63
  
64
  
65
  
66
  
67
  
68
  
69
  
70
  
71
  
72
  
73
  
74
  
75
  
76
  
77
  
78
  
79
  
80
  
81
  
82
  
83
  
84
  
85
  
86
  
87
  
88
  
89
  
90
  
91
  
92
  
93
  
94
  
95
  
96
  
97
 

文章来源: codeboy.blog.csdn.net，作者：愚公搬代码，版权归原作者所有，如需转载，请联系作者。

原文链接：codeboy.blog.csdn.net/article/details/107144027