成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ES6中class私有屬性和私有方法

bergwhite / 3495人閱讀

摘要：新增的語法非常帥，但是圍繞這個新的語法糖，在中如何實現(xiàn)靜態(tài)屬性私有屬性私有方法的問題，成為了大家探討的話題。私有方法理論上講，私有屬性和私有方法的區(qū)別是，私有方法是函數(shù)。

ES6新增的class語法非常帥，但是圍繞這個新的語法糖，在class中如何實現(xiàn)靜態(tài)屬性、私有屬性、私有方法的問題，成為了大家探討的話題。本文打算繞過現(xiàn)有的weakmap、symbol的方案，從最簡單的實踐中抽取出滿足要求的方案。

靜態(tài)屬性

靜態(tài)方法非常好實現(xiàn)，就是在普通方法名前面添加static關(guān)鍵字。那么靜態(tài)屬性呢？其實也可以通過static關(guān)鍵字來處理：

class MyClass {
    static get name() {
        return "my name"
    }
}

這樣就可以使用MyClass.name獲取靜態(tài)屬性值了。而且因為沒有設(shè)置setter，所以這個靜態(tài)屬性值還不能被改變。當(dāng)然，你也可以把setter加上去。

私有屬性

首先要搞明白“私有屬性”意味著幾層意思，不是說形式上滿足需求就可以，而是要從代碼的機理上實現(xiàn)“私有”效果：

1 class內(nèi)部不同方法間可以使用，因此this要指向?qū)嵗瘜ο螅ū仨殻?br>2 不能被外部訪問，因此實例化對象person.name既不能獲得值，也不能設(shè)定值，應(yīng)該返回undefined，甚至應(yīng)該在實例化之后，并不知道有name這個屬性存在，開發(fā)者甚至可以自己再person.name = "new name"動態(tài)去創(chuàng)建一個非私有屬性（必須）
3 不能被繼承，因此extends后子類不具備該屬性（必須）
4 方便的調(diào)用方式，比如類this._name形式（備選）

上面這些應(yīng)該是作為私有屬性的主要條件，如果連這些都不滿足，很難談得上叫“私有屬性”。

實現(xiàn)方法：

var attributions = {}
function get(that, key) {
    return attributions[that] && attributions[that][key]
}
function set(that, key, value) {
    if(!attributions[that]) attributions[that] = {}
    attributions[that][key] = value
}

class MyClass {
    set() {
        set(this, "name", "my name")
    }
    get() {
        let name = get(this, "name")
        console.log(name)
    }
}

在類外面有一個輔助對象attributions，兩個輔助函數(shù)set, get。它們將不被實例化對象直接訪問，因此是一個相對封閉的空間，外部完全無法訪問set, get函數(shù)操作的內(nèi)容，但對于類的實例化對象而已，確實有自己對應(yīng)的屬性內(nèi)容，因此，這種方案，可以代替類內(nèi)部的私有屬性的功能。

私有方法

理論上講，私有屬性和私有方法的區(qū)別是，私有方法是函數(shù)。因此，實際上，上面私有屬性的實現(xiàn)過程中已經(jīng)實現(xiàn)了私有方法，就是上面的set, get兩個輔助函數(shù)，這兩個函數(shù)幫助類完成一些操作，同時對于每一個實例化對象而言都可以設(shè)置對應(yīng)的值，而且也不會被外部獲取。

getter和setter的實現(xiàn)

現(xiàn)在很多類實現(xiàn)了getter和setter，將內(nèi)部的數(shù)據(jù)管理和自身的屬性分開，改變數(shù)據(jù)和改變屬性是兩回事。

var events = {}
var data = {}
class MyClass {
    on(event, handler) {
        if(!events[event]) events[event] = []
        events[event].push(handler)
    }
    trigger(event, params = []) {
        let evts = events[event]
        if(Array.isArray(evts)) evts.forEach(callback => {
            if(typeof callback === "function") {
                if(Array.isArray(params)) callback.apply(this, params)
                else callback.call(this, params)
            }
        })
    }
    get(key) {
        return data[this] && data[this][key]
    }
    set(key, value, notify = true) {
        if(!data[this]) data[this] = {}
        data[this][key] = value
        if(notify) {
            this.trigger("change:" + key, value)
        }
    }
    call(factory, ...args) {
        factory.apply(this, args)
    }
}

上面的類中定義了我們最常用的on, trigger, get, set, call這幾個方法。使用方法：

var a = new MyClass()
a.on("change:name", value => console.log(value))
a.set("name", "my value")

這樣不僅可以有效的管理組織自己的數(shù)據(jù)，而且還可以通過綁定，實現(xiàn)數(shù)據(jù)變化的監(jiān)聽。

求個兼職，如果您有web開發(fā)方面的需要，可以聯(lián)系我，生活不容易，且行且珍惜。
我的個人博客 www.tangshuang.net 這里就不留信息了，請在博客留言，我會聯(lián)系你

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/86801.html

相關(guān)文章

  • JavaScript => TypeScript 類入門

    摘要：靜態(tài)屬性靜態(tài)方法目前支持靜態(tài)方法表示，類屬性及靜態(tài)屬性目前作為提案還未正式成為標(biāo)準(zhǔn)。在中，抽象類不能用來實例化對象，主要做為其它派生類的基類使用。不同于接口，抽象類可以包含成員的實現(xiàn)細(xì)節(jié)。中也是這樣規(guī)定的抽象類不允許直接被實例化。 嘗試重寫 在此之前，通過《JavaScript => TypeScript 入門》已經(jīng)掌握了類型聲明的寫法。原以為憑著那一條無往不利的規(guī)則，就可以開開心心的...

    geekidentity 評論0 收藏0

  • ES6 系列之私有變量的實現(xiàn)

    摘要：前言在閱讀入門的時候，零散的看到有私有變量的實現(xiàn)，所以在此總結(jié)一篇。構(gòu)造函數(shù)應(yīng)該只做對象初始化的事情，現(xiàn)在為了實現(xiàn)私有變量，必須包含部分方法的實現(xiàn)，代碼組織上略不清晰。 前言 在閱讀 《ECMAScript 6 入門》的時候，零散的看到有私有變量的實現(xiàn)，所以在此總結(jié)一篇。 1. 約定 實現(xiàn) class Example { constructor() { this...

    lentoo 評論0 收藏0

  • 面向?qū)ο筇卣髦庋b-Es6中Class私有和受保護的屬性及方法

    摘要：熟悉面向?qū)ο缶幊痰亩贾?，面向?qū)ο缶幊套钪匾脑瓌t之一從外部接口劃分內(nèi)部接口。所以，面向?qū)ο缶幊叹皖愃朴谄囈粯印? 熟悉面向?qū)ο缶幊痰亩贾?，面向?qū)ο缶幊套钪匾脑瓌t之一 - 從外部接口劃分內(nèi)部接口。也就是說，針對某一類事物，我們其實并不是那么在乎其內(nèi)部究竟是怎樣去實現(xiàn)的，只關(guān)心怎樣使用而已。 為了理解這點，讓我們先來看看現(xiàn)實生活中的列子。通常，我們使用的設(shè)備非常復(fù)雜。但是從外部接口界...

    neuSnail 評論0 收藏0

  • ES5 中模擬 ES6 的 Symbol 實現(xiàn)私有成員

    摘要：中有類語法，定義類變得簡單了然而，并沒有提供私有屬性。按照此思路，在中其實也很容易模擬私有成員。問題在于模擬的唯一性。在開發(fā)階段這個值仍然是不可預(yù)料的。綜上，中模擬來實現(xiàn)私有屬性的目的已經(jīng)達到了。 ES6 中有類語法，定義類變得簡單了 class Person { constructor(name) { this._name = name; } ...

    livem 評論0 收藏0

  • ES6的一個基礎(chǔ)類，支持私有屬性和方法，支持event和mix

    摘要：綁定事件，傳入一個回調(diào)函數(shù)，但是這里還給加了一個功能，就是第三個參數(shù)規(guī)定回調(diào)函數(shù)執(zhí)行的順序。比如當(dāng)你給同一個事件傳入了多個回調(diào)函數(shù)，怎么來規(guī)定它們之間的順序呢通過傳入第三個參數(shù)即可，數(shù)字越小的，越靠前執(zhí)行。 ES6提供了完整的class語法，因此，可以非常方便的使用extends關(guān)鍵字對類進行擴展（繼承）。為了實現(xiàn)類的一些基礎(chǔ)功能，我撰寫了下面這個類，用以被其他類繼承，擁有這個基礎(chǔ)類的...

    Jeffrrey 評論0 收藏0

發(fā)表評論

0條評論

bergwhite

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<