這篇文章主要為大家詳細介紹了JavaScript的setter與getter方法,具有一定的參考價值,有興趣的小夥伴們可以參考一下
以前在寫專案過程一直都沒有使用過Javascript的setter與getter方法,所以對其是一種要懂不懂的概念;今天看書看到這個知識點,還是模模糊糊的,於是就打算研究研究;
Javascript對象的屬性是由名字,值和一組特性構成的。那麼首先,來了解一下物件的兩個屬性:
資料屬性,我們經常使用,應該很熟悉
存取器屬性,也稱為存取器屬性
何為存取器屬性?就是一組取得和設定值的函數。在ECMAScript5中,屬性值可以用一個或兩個方法設置,這兩個方法就是getter和setter;因此getter和setter定義的屬性稱為存取器屬性。
var o = { get val(){ /*函数体*/ return ; }, set val(n){ /*函数体*/ } }
上面的就是一個存取器屬性定義的最簡單的方法,可以看出getter和setter方法其實就是取代function的一個函數。
var o = { a:3, get val(){ return Math.pow(this.a,2); } } console.log(o.val);//9 o.val = 100; console.log(o.val);//9
getter方法是無參數,並且有傳回值的;當單獨設定getter方法時,只能取得屬性值,無法變更其定義的屬性值的,保證了資料的安全性;
var o = { a:3, set val(n){ this.a = n; } } console.log(o.val);//undefined
setter方法是有參數,沒有回傳值的;當單獨設定setter方式時,是無法讀取屬性值的;
var o ={ a:3, get val(){ return Math.pow(this.a,n); }, set val(n){ this.a = Math.max(this.a,n); } } console.log(o.a);//3 console.log(o.val);//9 o.val = 10; console.log(o.a);//10 console.log(o.val);//100
透過上面的程式碼可以看出,其中this是指其物件(即程式碼中的「o」);
var o ={ a:3, get val(){ return Math.pow(this.a,n); }, set val(n){ this.a = Math.max(this.a,n); } } o.val = 10; var foo = Object.create(o); console.log(foo.val);//10 foo.val = 9; console.log(foo.val);//10
上面是我整理給大家的,希望今後會對大家有幫助。
相關文章:
以上是在JavaScript中如何使用setter與getter方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!