詳解JavaScript如何設(shè)置私有屬性
ES6之前的私有屬性模擬
1、構(gòu)造函數(shù)形式創(chuàng)建對(duì)象
function Person(name) {
let _name = name; // 私有屬性
this.getName = function() {
return _name;
};
this.setName = function(newName) {
_name = newName;
};
}
let person = new Person('Alice');
console.log(person.getName()); // Alice
person.setName('Bob');
console.log(person.getName()); // Bob
// console.log(person._name); // 這會(huì)報(bào)錯(cuò)，因?yàn)開(kāi)name是私有的
在這個(gè)例子中，_name是一個(gè)私有屬性，因?yàn)樗窃诤瘮?shù)作用域內(nèi)定義的，外部無(wú)法直接訪問(wèn)。
2、字面量形式創(chuàng)建對(duì)象
let obj = (function() {
let privateVar = 'I am private';
return {
publicMethod: function() {
console.log(privateVar);
}
};
})();
obj.publicMethod(); // 正確訪問(wèn)私有變量
// console.log(obj.privateVar ); // 這會(huì)報(bào)錯(cuò)，因?yàn)閜rivatVvar是私有的
在這個(gè)例子中，privatVvar是一個(gè)真正的私有變量，因?yàn)樗窃谝粋€(gè)立即執(zhí)行函數(shù)表達(dá)式（IFEe）的作用域內(nèi)定義的，外部代碼無(wú)法直接訪問(wèn)。我們通過(guò)返回的對(duì)象中的publiMmethod方法來(lái)暴露對(duì)privatVvar的訪問(wèn)。
ES6中創(chuàng)建私有屬性
class Person {
#name; // 私有屬性
constructor(name) {
this.#name = name;
}
getName() {
return this.#name;
}
setName(newName) {
this.#name = newName;
}
}
let person = new Person('Alice');
console.log(person.getName()); // Alice
person.setName('Bob');
console.log(person.getName()); // Bob
// console.log(person.#name); // 這會(huì)報(bào)錯(cuò)，因?yàn)?name是私有的
私有屬性的好處
私有屬性有以下好處：
1.封裝性：私有屬性可以隱藏類的內(nèi)部實(shí)現(xiàn)細(xì)節(jié)，只暴露必要的接口給外部使用。
2.安全性：防止外部代碼隨意修改類的內(nèi)部狀態(tài)，可能導(dǎo)致錯(cuò)誤或不一致的狀態(tài)。
3.維護(hù)性：當(dāng)類的內(nèi)部實(shí)現(xiàn)發(fā)生變化時(shí)，只要保持接口不變，就不會(huì)影響到使用該類的其他代碼。
到此這篇關(guān)于詳解JavaScript如何設(shè)置私有屬性的文章就介紹到這了,更多相關(guān)JavaScript設(shè)置私有屬性內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
記錄一下這些內(nèi)容只是以后查閱起來(lái)方便，作為自己知識(shí)積累的記錄。其中有很多是參考網(wǎng)絡(luò)上的資源，不再一一寫出出處，還請(qǐng)?jiān)髡咭?jiàn)諒。2010-12-12
JS面向?qū)ο缶幊虒?shí)現(xiàn)的Tab選項(xiàng)卡案例詳解
這篇文章主要介紹了JS面向?qū)ο缶幊虒?shí)現(xiàn)的Tab選項(xiàng)卡,結(jié)合具體案例形式詳細(xì)分析了JS基于面向?qū)ο蟪绦蛟O(shè)計(jì)實(shí)現(xiàn)Tab選項(xiàng)卡的相關(guān)操作技巧,需要的朋友可以參考下2020-03-03
深入理解setTimeout函數(shù)和setInterval函數(shù)
下面小編就為大家?guī)?lái)一篇深入理解setTimeout函數(shù)和setInterval函數(shù)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
文檔對(duì)象模型 (DOM) 表示 HTML 文檔的結(jié)構(gòu),導(dǎo)航或“遍歷”此結(jié)構(gòu)是 Web 開(kāi)發(fā)的基本方面,使開(kāi)發(fā)人員能夠在網(wǎng)頁(yè)上選擇、修改、刪除或添加內(nèi)容,本文深入研究了使用 JavaScript 進(jìn)行 DOM 遍歷的藝術(shù),提供了一個(gè)強(qiáng)大的工具包來(lái)處理各種遍歷場(chǎng)景2023-09-09
所謂的遞歸函數(shù)就是在函數(shù)體內(nèi)調(diào)用本函數(shù)。使用遞歸函數(shù)一定要注意，處理不當(dāng)就會(huì)進(jìn)入死循環(huán)。遞歸函數(shù)只有在特定的情況下使用 ，比如階乘問(wèn)題2012-10-10
javascript實(shí)現(xiàn)圖片循環(huán)漸顯播放的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)圖片循環(huán)漸顯播放的方法,涉及javascript操作圖片的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
JS正則表達(dá)式學(xué)習(xí)之貪婪和非貪婪模式實(shí)例總結(jié)
這篇文章主要介紹了JS正則表達(dá)式學(xué)習(xí)之貪婪和非貪婪模式用法,結(jié)合實(shí)例形式總結(jié)分析了JS正則表達(dá)式中貪婪模式與非貪婪模式的具體功能、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-12-12
點(diǎn)擊顯示指定元素并隱藏其他同輩元素，下面有個(gè)不錯(cuò)的方法,需要的朋友可以參考下2014-02-02
前端小知識(shí)之??=?操作符更簡(jiǎn)潔的默認(rèn)值處理方式
這篇文章主要介紹了前端小知識(shí)之??=?操作符更簡(jiǎn)潔的默認(rèn)值處理方式的相關(guān)資料,??=操作符是JavaScript中用于設(shè)置默認(rèn)值的新操作符,它僅在變量值為null或undefined時(shí)才賦值,需要的朋友可以參考下2024-11-11
javascript基礎(chǔ)知識(shí)之html5輪播圖實(shí)例講解（44）
這篇文章主要為大家詳細(xì)介紹了javascript基礎(chǔ)知識(shí)之html5輪播圖，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02