2016-07-31 17 views
2

私はBootstrap 4のソースコードを調べていましたが、彼らはes6クラスを使用していて、ある種の明らかなモジュールパターンと結合していることを発見しました。ブートストラップ4がes6クラスでプライベートメソッドを使用するのはなぜですか?

hereから取得したコードの簡略化した例を次に示します。

const Modal = (($) => { 


    const NAME       = 'modal' 
    const VERSION      = '4.0.0-alpha.3' 
    ... 

    const Default = { 
    ... 
    } 


    class Modal { 

    constructor(element, config) { 
     this._config    = this._getConfig(config) 
     this._element    = element 
     ... 
    } 


    // public 

    toggle(relatedTarget) { 
     ... 
    } 

    show(relatedTarget) { 
     ... 
    } 

    hide(event) { 
     ... 
    } 

    dispose() { 
     ... 
    } 


    // private 

    _getConfig(config) { 
     ... 
    } 

    _showElement(relatedTarget) { 
     ... 
    } 

    _enforceFocus() { 
     ... 
    } 

    _setEscapeEvent() { 
     ... 
    } 

    _setResizeEvent() { 
     ... 
    } 

    } 

    return Modal 

})(jQuery) 

export default Modal 

この結果、すべてのメソッドまたはプロパティがプライベートプロパティを含めて公開されます。ただし、これは最終製品では発生しません。たとえば、$('#myModal').modal('_getConfig')のようなものは動作しません。何が起こっている?

+0

恐らく 'modal'は名前がアンダースコアで始まるかどうかをチェックします... – Bergi

答えて

4

それが唯一のjQueryのプロトタイプ_jQueryInterfaceに一つの機能を追加しています:あなたはあなたが表示されます_jQueryInterfaceのコードを見れば

$.fn[NAME]    = Modal._jQueryInterface 
    $.fn[NAME].Constructor = Modal 
    $.fn[NAME].noConflict = function() { 
    $.fn[NAME] = JQUERY_NO_CONFLICT 
    return Modal._jQueryInterface 
    } 

    return Modal 

})(jQuery) 

static _jQueryInterface(config, relatedTarget) { 
    return this.each(function() { 
    let data = $(this).data(DATA_KEY) 
    let _config = $.extend(
     {}, 
     Modal.Default, 
     $(this).data(), 
     typeof config === 'object' && config 
    ) 

    if (!data) { 
     data = new Modal(this, _config) 
     $(this).data(DATA_KEY, data) 
    } 

    if (typeof config === 'string') { 
     if (data[config] === undefined) { 
     throw new Error(`No method named "${config}"`) 
     } 
     data[config](relatedTarget) 
    } else if (_config.show) { 
     data.show(relatedTarget) 
    } 
    }) 
} 

を私たちはよく見ると、あなた'LL Modalクラスのインスタンスがdataとして保存されていることを確認してください:

if (!data) { 
     data = new Modal(this, _config) 
     $(this).data(DATA_KEY, data) 
    } 

あなたは、スクリプトがそれをしないと同じ方法でアクセスすることができます(ただし、初回のみのためにそれを作成した後):

$('#myModal').modal('_getConfig'); 

let data = $(this).data(DATA_KEY) 

DATA_KEYbs.modal

編集です

実際には_getConfigという関数が呼び出されていますが、その関数は、の結果が何であっても、jQueryオブジェクトを返すだけですはです。

+0

正しいので、これらのプライベートメソッドは実際にはプライベートではありません – Pontiacks

関連する問題