欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS?中的類Public,Private?和?Protected詳解

 更新時(shí)間:2022年08月24日 10:24:02   作者:前端黑板報(bào)???????  
這篇文章主要介紹了JS中的類Public,Private和Protected詳解,文章圍繞主題展開詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參考一下

前言

原文地址:dev.to/bhagatparwi…

即使 ES6 中引入了 class 關(guān)鍵字很好的模擬了類的行為以及使我們可以進(jìn)行面向?qū)ο缶幊蹋?JavaScript 中的類缺失了創(chuàng)建公共、私有和保護(hù)成員的能力。

若你之前使用過其他面向?qū)ο蟮木幊陶Z(yǔ)言,肯定知道內(nèi)部和外部接口的重要性。內(nèi)部接口引用的方法和屬性只能在類的內(nèi)部獲取。相反,外部接口的方法和屬性可以在內(nèi)外部都可獲取。

主要有三個(gè)關(guān)鍵字在起作用:public、protected 和 private。

  • public:類的所有成員都可以被類的實(shí)例獲取。
  • private:類成員只能在類中被訪問。
  • protected:類成員在類以及子類中可以被訪問

在 JavaScript 中 protected 關(guān)鍵字是最難模擬的。

public

publick 是 JavaScript 中默認(rèn)的,如果從對(duì)象上可以獲取的東西,那也可以從它的實(shí)例上獲取。

const myObject = {
    name: "Parwinder",
    sayMyName: function () {
        return this.name;
    }
}

console.log(myObject.name); // Parwinder
console.log(myObject.sayMyName()); // Parwinder

上面的例子中,我可以獲取屬性和方法不會(huì)產(chǎn)生任何問題,若你更傾向類語(yǔ)法:

class ObjectCreator {
    name;

    constructor(name) {
        this.name = name;
    }
    sayMyName() {
        return this.name;
    }
}
const myObject = new ObjectCreator("Parwinder");
console.log(myObject.name); // Parwinder
console.log(myObject.sayMyName()); // Parwinder

private

JavaScript 中有很多方法創(chuàng)建私有變量,第一個(gè)是閉包:

function carMonitor() {
    var speed = 0;

    return {
        accelerate: function () {
            return speed++;
        }
    }
}
var car = new carMonitor();
var redCar = new carMonitor()
console.log(car.accelerate()); // 0
console.log(car.accelerate()); // 1
console.log(redCar.accelerate()); // 0
console.log(redCar.accelerate()); // 1
console.log(car.accelerate()); // 2
console.log(redCar.accelerate()); // 2
console.log(speed); // speed is not defined

car 和 redCar 各自維護(hù)它們自己的 speed 變量并且外部無法獲取它。在構(gòu)造函數(shù)或類中,我們強(qiáng)制用戶通過方法來獲取屬性而不是直接讀寫。這也就是如何封裝代碼。

第二個(gè)方法就是使用 # 符號(hào)。

class ObjectCreator {
    #meaningOfLife;

    constructor(name) {
        this.#meaningOfLife = 42;
    }

    returnMeaningOfLife() {
        return this.#meaningOfLife;
    }

    #returnAMessage() {
        return "You will do great things in life";
    }
}

const myObject = new ObjectCreator("Parwinder");
console.log(myObject.returnMeaningOfLife()); // 42
console.log(myObject["#meaningOfLife"]); // undefined
console.log(myObject.#meaningOfLife); // SyntaxError
console.log(myObject.#returnAMessage); // SyntaxError

從語(yǔ)言層面強(qiáng)制封裝了代碼,外部直接獲取 # 引用的字段則會(huì)報(bào)錯(cuò)。public 和 private 字段同時(shí)存在不會(huì)沖突,在同一個(gè)類中既可以有私有的 #meaningOfLife 也可以有公共的 meaningOfLife。

類中使用 # 符號(hào)來聲明私有成員是在 ES2019/ES10 中引入的。

protected

就像我前面說的在 JavaScript 中 protected 是三個(gè)方法中最難實(shí)現(xiàn)的。我能想到的途徑是通過只存在 getter 而沒有 setter 的方法來實(shí)現(xiàn) protected 。

若你有別的方法實(shí)現(xiàn),請(qǐng)分享一下!

class NameGenerator {
    _name;

    constructor(name) {
        this._name = name;
    }

    get name() {
        return this._name;
    }
}

let nameGenerator = new NameGenerator("John");
console.log(`My name is ${nameGenerator.name}`); // My name is John
nameGenerator.name = "Jane"; // Cannot assign to 'name' because it is a read-only property.

到此這篇關(guān)于JS 中的類Public,Private 和 Protected詳解的文章就介紹到這了,更多相關(guān)JS Public,Private ,Protected內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論