Javascriptオブジェクト構造を整理するのに好ましい方法

Question

大きなオブジェクト構造を整理するための標準的または一般的な方法は何か不思議でした。私の最初の反応はそうのようにそれを整理しました：

GLOBAL = { 
    child_1 : { 
    obj_1 : null, 
    obj_2 : null, 
    func_1 : function() { 
     //Stuff defined here.... 
    } 
    }, 
    child_2 : { 
    obj_1 : null, 
    obj_2 : null, 
    func_1 : function() { 
     //Stuff defined here.... 
    } 
    }, 
    child_3 : { 
    .... 

}; 

これは、最初はかなりあるが、ファイルが大きく、大きくなると機能が定義され得るように、機能のような、同じ名前を持つ場合は特に読みにくくなります、 "GLOBAL.child_1.func_1"、 "GLOBAL.child_2.func_1"があります。

大きなアプリケーションを構成する標準的な方法はありますか？私はそれをかなり保つことができる1つの方法は、オブジェクト階層内ではなく他の場所で関数を定義することだと思います。

Answer 1

私もこれで苦労します。ここで私は啓発見つけ、いくつかのブログの記事は以下のとおりです。

http://michaux.ca/articles/javascript-namespacing

http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript/#more-1789

Answer 2

あなたはそれらをすべて1つの巨大な入れ子構造に入れる必要はありません。次のようにすることもできます：

var GLOBAL = {}; 

GLOBAL.child_1 = { 
    obj_1 : null, 
    obj_2 : null, 
    func_1 : function() { 
     //Stuff defined here.... 
    }; 

GLOBAL.child_2 = { 
    obj_1 : null, 
    obj_2 : null, 
    func_1 : function() { 
     //Stuff defined here.... 
    }; 

GLOBAL.child_3 = { 
    .... 

}; 

また、なぜchild_1とchild_2のような総称名を使用しているのか分かりません。彼らが独特の機能を持っているなら、それらの機能を記述する一意の名前が与えられます。それらがすべて同じ機能を持っている場合は、複数のインスタンスを作成できる再利用可能なオブジェクトを作成します。それらがすべて同一で、事前に宣言されたデータがない場合は、ループ内ですべてを初期化するだけです。

Answer 3

あなたの質問は非常に面白く、その答えは非常に複雑かもしれません。私は（いくつかのリンクは、jQueryの参照が、これに限られるものではない）あなたはその対象についてのいくつかのリンクを提供します：

http://addyosmani.com/blog/large-scale-jquery/

http://blog.rebeccamurphey.com/on-jquery-large-applications

また、私はあなたを与えることができます1つの先端はあなたのコードを分離することですこのパターンを使用して：そのパターンと

// file yoursite.somename.js 
var GLOBAL = GLOBAL || {}; 
GLOBAL.somename = { 
    someFunction: function() {} 
    // [...] 
}; 

// file yoursite.someothername.js 
var GLOBAL = GLOBAL || {}; 
GLOBAL.someothername = { 
    anotherFunction: function() {} 
    // [...] 
}; 

を、各機能は、単一のファイルに分離され、各ファイルはGLOBALオブジェクトに一つのキーを追加します。そのオブジェクトは一度だけ宣言され、決して上書きされません。