JavaScript的setter與getter方法
以前在寫項目過程一直都沒有使用過Javascript的setter與getter方法，所以對其是一種要懂不懂的概念；今天看書看到這個知識點，還是模模糊糊的，于是就打算研究研究；
Javascript對象的屬性是由名字，值和一組特性構(gòu)成的。那么首先，來了解一下對象的兩種屬性：
數(shù)據(jù)屬性，我們經(jīng)常使用，應(yīng)該很熟悉
訪問器屬性，也稱存取器屬性
何為存取器屬性？就是一組獲取和設(shè)置值的函數(shù)。在ECMAScript5中，屬性值可以用一個或兩個方法設(shè)置，這兩個方法就是getter和setter；因此getter和setter定義的屬性被稱為存取器屬性。
var o = {
get val(){
/*函數(shù)體*/
return ;
},
set val(n){
/*函數(shù)體*/
}
}
上面的就是一個存取器屬性定義的最簡單的方法，可以看出getter和setter方法其實就是取代function的一個函數(shù)。
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方法是無參數(shù)，并且有返回值的；當(dāng)單獨設(shè)置getter方法時，只能獲取屬性值，無法更改其定義的屬性值的，保證了數(shù)據(jù)的安全性；
var o = {
a:3,
set val(n){
this.a = n;
}
}
console.log(o.val);//undefined
setter方法是有參數(shù)，沒有返回值的；當(dāng)單獨設(shè)置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
另外，存取器屬性也是可以被繼承的；
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
uniapp微信小程序訂閱消息發(fā)送服務(wù)通知超詳細(xì)教程
在使用或開發(fā)小程序過程中,我們會發(fā)現(xiàn)消息通知是非常重要的一個環(huán)節(jié),下面這篇文章主要給大家介紹了關(guān)于uniapp微信小程序訂閱消息發(fā)送服務(wù)通知的相關(guān)資料,需要的朋友可以參考下2023-06-06
這篇文章主要對javascript的數(shù)組方法進(jìn)行了詳細(xì)的匯總，包括了最常用的的數(shù)組方法，還有擴(kuò)展方法，很全面，感興趣的小伙伴們可以參考一下2015-11-11
微信小程序?qū)崿F(xiàn)頁面導(dǎo)航與傳參功能詳解
這篇文章主要為大家詳細(xì)介紹一下微信小程序?qū)崿F(xiàn)頁面導(dǎo)航的幾種方法以及幫助大家掌握微信小程序如何進(jìn)行傳遞參數(shù)，感興趣的朋友可以了解一下2022-08-08
javascript 方法一些使用方法,注意看下他的函數(shù)。2009-05-05
淺談javascript中的prototype和__proto__的理解
這篇文章主要介紹了淺談javascript中的prototype和__proto__的理解，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
這篇文章主要介紹了淺談javascript 函數(shù)屬性和方法的相關(guān)資料,需要的朋友可以參考下2015-01-01
FireBug 調(diào)試JS入門教程 如何調(diào)試JS
這篇文章主要為大家介紹下通過firefox的FireBug調(diào)試JS，需要的朋友可以參考下2013-12-12
html5+CSS 實現(xiàn)禁止IOS長按復(fù)制粘貼功能
因為在移動端APP需要實現(xiàn)長按執(zhí)行別的事件，但是在iOS系統(tǒng)有默認(rèn)的長按選擇復(fù)制粘貼。禁止在網(wǎng)上找了很多資料，下面小編給大家分享解決方案，一起看看吧2016-12-12
這篇文章主要介紹了原生js實現(xiàn)圖片輪播特效，適合用于商品展示，實現(xiàn)最簡單的廣告輪播效果，感興趣的小伙伴們可以參考一下2015-12-12
在本篇文章里我們給大家分享了關(guān)于js訪問對象的屬性和方法的相關(guān)知識點，有需要的朋友們可以學(xué)習(xí)下。2018-10-10