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」。

有沒有標準的方法來構建大型應用程序？有一種方法可以讓它保持漂亮，我想是在別處定義函數而不是在對象層次結構中定義函數。

Answer 1

我也在爲此而苦惱。這裏有一些博客文章，我覺得啓發：

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

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

Answer 2

您不必將它們全部置於一個巨大的嵌套結構中。你可以這樣做：

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

此外，一個提示我可以給你是分離代碼使用這種模式：

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

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

與該模式中，每個功能分開成單個文件，並且每個文件添加一個鑰匙插入GLOBAL對象。該對象將被聲明一次且永遠不會被覆蓋。