怎么使用Proxy來代理Js中的類

這篇文章將為大家詳細講解有關怎么使用Proxy來代理Js中的類，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

　　Proxy對象（Proxy）是ES6的一個非常酷卻鮮為人知的特性。雖然這個特性存在已久，但是我還是想在本文中對其稍作解釋，并用一個例子說明一下它的用法。如何使用Proxy來代理Js中的類？

　　如何使用代理Proxy

　　正如MDN上簡單而枯燥的定義：

　　Proxy對象用于定義基本操作的自定義行為（如屬性查找，賦值，枚舉，函數調用等）。

　　雖然這是一個不錯的總結，但是我卻并沒有從中搞清楚Proxy能做什么，以及它能幫我們實現什么。

　　首先，Proxy的概念來源于元編程。簡單的說，元編程是允許我們運行我們編寫的應用程序（或核心）代碼的代碼。例如，臭名昭著的eval函數允許我們將字符串代碼當做可執行代碼來執行，它是就屬于元編程領域。

　　ProxyAPI允許我們在對象和其消費實體中創建中間層，這種特性為我們提供了控制該對象的能力，比如可以決定怎樣去進行它的get和set，甚至可以自定義當訪問這個對象上不存在的屬性的時候我們可以做些什么。

　　如何使用代理Proxy的API

　　varp=newProxy(target,handler);

　　Proxy構造函數獲取一個target對象，和一個用來攔截target對象不同行為的handler對象。你可以設置下面這些攔截項：

　　has—?攔截in操作。比如，你可以用它來隱藏對象上某些屬性。

　　get—?用來攔截讀取操作。比如當試圖讀取不存在的屬性時，你可以用它來返回默認值。

　　set—用來攔截賦值操作。比如給屬性賦值的時候你可以增加驗證的邏輯，如果驗證不通過可以拋出錯誤。

　　apply—用來攔截函數調用操作。比如，你可以把所有的函數調用都包裹在try/catch語句塊中。

　　這只是一部分攔截項，你可以在MDN上找到完整的列表。

　　下面是將Proxy用在驗證上的一個簡單的例子：

constCar={
　　maker:'BMW',
　　year:2018,
　　};
　　constproxyCar=newProxy(Car,{
　　set(obj,prop,value){
　　if(prop==='maker'&&value.length<1){
　　thrownewError('Invalidmaker');
　　}
　　if(prop==='year'&&typeofvalue!=='number'){
　　thrownewError('Invalidyear');
　　}
　　obj[prop]=value;
　　returntrue;
　　}
　　});
　　proxyCar.maker='';//throwexception
　　proxyCar.year='1999';//throwexception

　　可以看到，我們可以用Proxy來驗證賦給被代理對象的值。

關于“怎么使用Proxy來代理Js中的類”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。