12

モジュールパターンについては、次のようなことをしています：

(function(namespace) {
    // tons of code
    // blabla
})(window.myGlobalNamespace);

コードを分割するにはどうすればよいですか? 名前空間の階層を使用したり、window.myGlobalNamespace.additionalFunc = function () {//blabla}. 他の方法は何ですか？長所と短所は何ですか？どちらがより良い習慣と考えられていますか?

2 つの回答はどちらも RequireJS を示唆しています。RequireJS がこれらの問題をどのように解決できるか説明してください。

first.js:

(function(context) {
    var parentPrivate = 'parentPrivate';
})(window.myGlobalNamespace);

second.js:

(function(context) {
    this.childFunction = console.log('trying to access parent private field: ' + parentPriavte);
}(window.myGlobalNamespace.subNamspace);

main.js:

window.myGlobalNamespace.subNamspace.childFunction(); // doesn't work

そして人はできる

window.myGlobalNamespace.subNamspace.childFunction = function() {alert("a new function");}

コードの動作を変更するには!

ここで、次の 2 つの問題があります。

  1. 子からはアクセスできるが、外部のパブリックにはアクセスできない (つまり、保護されている) フィールドを持つことはできません。それを達成する方法はありますか？

  2. そうでない場合、つまり、eparentPrivate にアクセスできるようにしたい場合は、公開する必要があります。その後、ユーザーはそれを変更できるようになります!

さらに、すべてのパブリック関数を変更および置換できます。そうなってほしくない。

RequireJS がこれらの問題をどのように解決するのかわかりません。誰かが光を当てることができますか？

4

4 に答える 4

3

あなたが求めているのはRequire JSのようです。現在、ほとんどすべてのビルドでこれを使用しています。別の方法として、フォールバックとして公開モジュール パターンを確認することもできますが、必要な場合は、Require の方がはるかに適しているように思えます。

http://requirejs.org

よく読んでください：http://net.tutsplus.com/tutorials/javascript-ajax/principles-of-maintainable-javascript/

于 2013-12-01T11:32:04.617 に答える
3

javascript の保護された変数は、保護された変数を依存関係として渡すことによって実現できます。保護された変数にアクセスできるのは親だけであるため、サブクラスは親内に作成する必要があります。例 jsFiddle

App = window.App || {};
App.ParentClass = (function(){

   var protectedState = {
      protectedVar: 'wow such protection'
   }

   return{
      SubClassInstance: App.SubClass(protectedState), //make the subclass accessible from outside
   }
})(); //closure gives us privacy

SubClass.js

App = window.App || {};
App.SubClass = function(protectedState){

    return {
        logProtectedVar : function(){
            //can access protectedState of parent
            console.log(protectedState.protectedVar);
        }
    }
}// I require protected state to work

main.js

// protected variable is accessible from parent and subclass and nowhere else

App.ParentClass.SubClassInstance.logProtectedVar();
// 'wow such protection'

注: Charles W. が述べたように、このパターンprotectedStateは がオブジェクトの場合にのみ機能します。文字列/整数の場合、値によって渡され、サブクラスで行われた変更は親のコピーからは見えません。

于 2013-12-09T08:25:24.853 に答える
1

モジュール化 (コードの分割) は、データ保護 (データの隠蔽) とは異なります。

RequireJS は、データ保護の問題ではなく、モジュール化の問題を解決します。別の言い方をすれば... データを保護しようとする際にどのような問題が存在し、データを保護するためにどのような解決策が存在するとしても、これらの問題と解決策は RequireJS の有無にかかわらず同じです。

RequireJS は、モジュール間の依存関係を指定し、必要な場合にのみこれらの依存関係をロードし、既にロードされているものの再ロードを回避し、まったく必要のないものをロードしないようにし、モジュールの場所をすばやく変更し、冗長性を持たせるためのすべてのメカニズムを実装します。 .

デプロイ後に RequireJS が重すぎると感じた場合は、代わりにアーモンドライブラリを使用できます。

子からはアクセスできるが、外部のパブリックにはアクセスできない (つまり、保護されている) フィールドを持つことはできません。それを達成する方法はありますか？

モジュール化が必要な場合 (つまり、子を親とは別にコーディングしたい場合)、JavaScript でこれが可能であるとは思えません。子と親を同じクロージャで動作させることは可能ですが、これはモジュラーではありません。これは、RequireJS の有無にかかわらず当てはまります。

そうでない場合、つまり、eparentPrivate にアクセスできるようにしたい場合は、公開する必要があります。その後、ユーザーはそれを変更できるようになります!

への割り当てを防ぎたい場合は、 を含む名前空間でparentPrivate使用できます。Object.freeze()parentPrivate

ただし、さまざまなブラウザでどれだけサポートされているかはわかりません。またparentPrivate、プリミティブ値ではなくそれ自体がオブジェクトである場合、コードのクライアントによって変更されたくない場合は、凍結する必要もあります。オブジェクトが凍結されると、オブジェクトを所有するモジュールがそれを変更するための特別な処理を受けないように、すべてのユーザーに対して凍結されます。そして凍結は何も隠しません。

または、次の RequireJS の例のようにセッターとゲッターを使用することもできます。

define(function () {
    'use strict';

    var writable = "initial value";

    var namespace = {
        get unwritable() { return writable; },
        doSomething: function () { writable = "changed value"; }

    };

    return namespace;

});

モジュールが としてインポートされた場合、parentにparent.unwritable書き込むことはできませんが、モジュール自体は、 に書き込むことによって返される値を変更できますwritable。ゲッターによって返される戻り値がプリミティブ値ではなくオブジェクトである場合、このオブジェクトは呼び出し元によって変更される可能性があることに注意してください。

繰り返しますが、これは RequireJS を使用するかどうかに関係なく当てはまります。解決策は同じ、問題は同じなどです。

于 2013-12-04T14:03:40.130 に答える