您好,登錄后才能下訂單哦!
這篇文章主要講解了“JavaScript的setter與getter方法的實(shí)例應(yīng)用”,文中的講解內(nèi)容簡(jiǎn)單清晰,易于學(xué)習(xí)與理解,下面請(qǐng)大家跟著小編的思路慢慢深入,一起來(lái)研究和學(xué)習(xí)“JavaScript的setter與getter方法的實(shí)例應(yīng)用”吧!
Javascript對(duì)象的屬性是由名字,值和一組特性構(gòu)成的。那么首先,來(lái)了解一下對(duì)象的兩種屬性:
數(shù)據(jù)屬性,我們經(jīng)常使用,應(yīng)該很熟悉
訪問(wèn)器屬性,也稱存取器屬性
何為存取器屬性?就是一組獲取和設(shè)置值的函數(shù)。在ECMAScript5中,屬性值可以用一個(gè)或兩個(gè)方法設(shè)置,這兩個(gè)方法就是getter和setter;因此getter和setter定義的屬性被稱為存取器屬性。
var o = { get val(){ /*函數(shù)體*/ return ; }, set val(n){ /*函數(shù)體*/ } }
上面的就是一個(gè)存取器屬性定義的最簡(jiǎn)單的方法,可以看出getter和setter方法其實(shí)就是取代function的一個(gè)函數(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方法是無(wú)參數(shù),并且有返回值的;當(dāng)單獨(dú)設(shè)置getter方法時(shí),只能獲取屬性值,無(wú)法更改其定義的屬性值的,保證了數(shù)據(jù)的安全性;
var o = { a:3, set val(n){ this.a = n; } } console.log(o.val);//undefined
setter方法是有參數(shù),沒(méi)有返回值的;當(dāng)單獨(dú)設(shè)置setter方式時(shí),是無(wú)法讀取屬性值的;
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
通過(guò)上面的代碼可以看出,其中this是指其對(duì)象(即代碼中的“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方法的實(shí)例應(yīng)用”的內(nèi)容了,經(jīng)過(guò)本文的學(xué)習(xí)后,相信大家對(duì)JavaScript的setter與getter方法的實(shí)例應(yīng)用這一問(wèn)題有了更深刻的體會(huì),具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是億速云,小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章,歡迎關(guān)注!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。