2012-04-05 8 views
0

グローバルオブジェクトを1つだけ持つように、ネストされたクラス定義をjavascriptで作成しようとしています。現時点で追加のグローバルオブジェクトを作成せずにネストされたクラス定義

我々はこのように新しいクラスを定義します。

FOO.Navigation.Sidebar.Tooltip = function() 
{ 
}; 

ので、各関数定義の中で、我々は全体の入れ子になったクラスの名前空間を繰り返す必要があります。私たちは、作成する名前空間の機能を導入

FOO.Navigation.Sidebar.Tooltip.prototype.show = function() 
{ 
    /* do something here */ 
}; 

クラス。

FOO = { /* ... */ } 

FOO.namespace = function(namespaceString) 
{ 
    var namespaceParts = namespaceString.split('.'); 
    var currentRoot = FOO; 
    var index = 0; 

    // Skip the first namespacePart, if it is already "FOO" 
    if ("FOO" == namespaceParts[0]) 
    { 
    index = 1; 
    } 

    var currentPart; 
    for(index; index < namespaceParts.length; index++) 
    {  
    // This is the next element in the namespace hierarchy. 
    currentPart = namespaceParts[index]; 
    // Add a new map for the currentPart to the root (if it does not exist yet). 
    currentRoot[currentPart] = currentRoot[currentPart] || {}; 
    // The currentPart will be the new root in the next loop. 
    currentRoot = currentRoot[currentPart]; 
    } 

    return currentRoot; 
}; 

は、今、私たちは次のようになります。以前の定義のより読みやすいバージョンを作成するために、これを使用する:

新しいグローバル変数「ツールチップ」を作成し、我々が入力する必要があります
FOO.Navigation.Sidebar.Tooltip = function() 
{ 
    this.hallo = "world"; 
}; 

var tooltip = FOO.Navigation.Sidebar.Tooltip; 

tooltip.prototype.show = function() 
{ 
    /* do something */ 
}; 

クラス名は二度。 は、だから我々はこのように無名関数を使用してのthougth:私たちは、「ツールチップ」に新しい関数定義をASSINGので、これは明らかに、動作しません

(function(tooltip) { 
    tooltip = function() 
    { 
    this.hello = "world"; 
    }; 

    tooltip.prototype.show= function() 
    { 
    /* do something */ 
    }; 
}) (FOO.namespace("FOO.Navigation.Sidebar.Tooltip")) 

グローバル変数をそれ以上作成せずにクラス名を1回だけ書く方法があれば、私の質問です。

+0

私はあなたがJavaではなくJavaScriptを書いていることを思い出しています。この 'foo.bar.baz.trev.cat.mouse'名前空間malarkeyはすべてJavaScriptに属していません。 – Matt

+0

さて、私たちはC++開発者にとってよりフレキシブルなフレームワークにしようとしています。そういうわけで、グローバル変数の追加などを避けようとしています。 –

答えて

0

Module Patternの実装を作成しようとしているようです。モジュールは、通常、単一のインスタンスオブジェクトを作成するために使用されます。しかし、新しいクロージャ(関数)を返すファクトリメソッドをモジュールに簡単に追加することができます。

上記で貼り付けたコードでは、クロージャ内の変数tooltipに直接メソッドを割り当てることができます。例えば:あなたは、階層クラス構造を作成したい場合は、次のような共通のJavaScriptライブラリのいずれかを検討する必要があります

// Invoke a static method. 
FOO.Navigation.Sidebar.Tooltip.hello();​ 

// Create a new ToolTip instance. 
var myToolTip = FOO.Navigation.Sidebar.Tooltip.create("Hello World"); 
myToolTip.show(); 

(function(Tooltip) { 
    // 'Static' method added to the module definition. 
    Tooltip.hello = function() { 
     alert("Hello!"); 
    }; 

    // Factory method which returns a new object. 
    Tooltip.create(message) { 
     return { 
      this.message = message; 
      this.show = function() { /* ... */ } 
     }; 
    } 
})(FOO.namespace("FOO.Navigation.Sidebar.Tooltip")); 

次に、あなたがツールチップ上helloメソッドを呼び出すことができますBackbone.js

+0

あなたは正しいですが、このように動作しなかったのは、コンストラクタを定義することです。 –

+0

こんにちはStefan、私はモジュールパターンへの参照とファクトリメソッドの追加を含む私の答えを更新しました。より古典的なOOPデザイン(JavaScriptの言語に反していると言われる)によって、よりうまく機能するかもしれないと私は思います。 – JonnyReeves

関連する問題