js的Proxy代理对象?看完你就会了!

　　

　　通过捕捉器，我们就可以捕获到 代码中对属性的操作时机，让我们能够先执行我们自定义的业务逻辑代码。因为我们对目标对象的属性操作改为了对代理对象相同的属性操作，所以我们在最后需要通过Reflact执行目标对象的原始操作。优品拍拍

　　var consume = 0

　　// 目标对象

　　var obj = {wallet: 100}

　　// 捕获器trap

　　var handlers = {

　　set(target, key, val) {

　　// target 目标对象

　　// key 代理对象要修改的属性

　　// 记录一笔消费

　　consume++

　　// 通过Reflact对象触发原始目标对象的属性操作

　　// 相当于执行 target[key] = val

　　Reflect.set(target, key, val)

　　}

　　}

　　// 代理对象

　　var pObj = new Proxy(obj, handlers)

　　// 将对目标对象obj的属性wallet操作改为代理对象相同属性wallet的操作you

　　pObj.wallet = 97

　　pObj.wallet = 94

　　pObj.wallet = 91

　　pObj.wallet = 88

　　pObj.wallet = 85

　　console.log(obj.wallet) // 85

　　console.log(consume) // 5

　　如何取消代理

　　假如某一天，你实现了财务自由，不需要再精打细算记录每一笔消费了，你可能就需要取消此前的代理，代码很简单，往下看：

　　var consume = 0

　　var obj = {wallet: 100}

　　var handlers = {

　　set(target, key, val) {

　　consume++

　　Reflect.set(target, key, val)

　　}

　　}

　　// 使用Proxy.revocable创建代理

　　var tmpObj = Proxy.revocable(obj, handlers)

　　var pObj = tmpObj.proxy

　　var prevoke = tmpObj.revoke

　　// 使用代理对象进行消费记账

　　pObj.wallet = 97

　　pObj.wallet = 94

　　pObj.wallet = 91

　　// 某一天，我们实现了一个小目标

　　pObj.wallet = 100000000

　　// 我们不需要记账了，我们需要取消创建的代理

　　prevoke() // 执行prevoke即可，就是这么简单 哦耶~

　　pObj.wallet = 99999997 // TypeError 报错啦 (代理取消之后就不能使用了哟!)

　　代理在后模式

　　前面的示例都是先执行代理捕获器中的业务逻辑，最后再通过Reflect执行目标对象的属性操作，这种捕获代码操作在前，目标对象操作在后的模式称为“代理在先”模式，有在先，当然就有在后模式。

　　当然这里的“代理在后”模式并不是先使用Reflect对象触发目标对象属性操作，在执行捕获器中的其他操作代码。而是指代理作为目标对象的一种补充，我们仍然操作的是目标对象，只是当某些操作在目标对象上无法实现时，才使用代理对象。

　　等会，当某些操作目标对象无法提供时，js会向目标对象的原型prototype上进行查找，所以“代理在后”模式是对目标对象的原型进行代理!

　　var handlers = {