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