第十三節、用 Proxy 進行預處理
阿新 • • 發佈：2019-01-29
相信大家對鉤子函式會有一定的瞭解，這裡簡單解釋一下什麼是鉤子函式。當我們在操作一個物件或者方法時會有幾種動作，比如：在執行函式前初始化一些資料，在改變物件值後做一些善後處理。這些都算鉤子函式，Proxy 的存在就可以讓我們給函式加上這樣的鉤子函式，你也可以理解為在執行方法前預處理一些程式碼。你可以簡單的理解為他是函式或者物件的生命週期。
Proxy的應用可以使函式更加強大，業務邏輯更加清楚，而且在編寫自己的框架或者通用元件時非常好用。Proxy涉及的內容非常多，那這裡我就帶你入門並且介紹給你後續的學習方法。
在學習新知識之前，先來回顧一下定義物件的方法。
var obj={
add:function 聲明瞭一個obj物件，增加了一個物件方法add和一個物件屬性name，然後在控制檯進行了列印。
宣告 Proxy
我們用new的方法對Proxy進行宣告。可以看一下宣告Proxy的基本形式。
new Proxy({},{});需要注意的是這裡是兩個花括號，第一個花括號就相當於我們方法的主體，後邊的花括號就是Proxy代理處理區域，相當於我們寫鉤子函式的地方。
get 屬性
get 屬性是你在得到某個物件屬性值時預處理的方法，他接受三個引數
- targer：得到的目標值
- key：目標的 key 值，相當於物件的屬性
- property ：這個不太常用
set 屬性
set 屬性是指你要改變 Proxy 屬性值時，進行的預先處理。它接收四個引數：
- target：目標值
- key：目標的 key 值
- value：要改變的值
- receiver：改變前的原始值
var pro = new Proxy({
add:function (val) {
return val+10;
},
name:'proxy'
},{
get apply 的使用
apply 的作用是呼叫內部的方法，它使用在方法體是一個匿名函式時。
let target = function () {
return 'proxy';
};
var handler = {
apply(target,ctx,args){
console.log('do apply');
return Reflect.apply(...arguments);
}
}
var pro = new Proxy(target,handler);
console.log(pro());其實proxy的知識是非常多的，這裡建議看阮一峰大神的《ES6》。這裡只能算是入門課程。