Javascript首选的组织对象结构的方式

Javascript preferred way to organize object structure

本文关键字:对象 结构 方式 Javascript      更新时间:2023-09-26

我很好奇组织大型对象结构的标准或常用方法是什么。我的第一反应是这样组织它:

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"answers"GLOBAL.child_2.func_1"。

是否有一个标准的方法来构建大型应用程序?我想,保持美观的一种方法是在其他地方定义函数,而不是在对象层次结构中定义函数。

我也很纠结。以下是一些我觉得很有启发的博客文章:

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

http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript/更多- 1789

你不必把它们都放在一个巨大的嵌套结构中。你可以这样做:

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这样的通用名。如果它们有唯一的功能,那么给它们一个唯一的名字来描述它们的功能。如果它们都具有相同的功能,那么创建一个可以创建多个实例的可重用对象。如果它们都是相同的,并且没有唯一的预声明数据,那么只需在循环中初始化它们。

你的问题很有趣,答案可能很复杂。我会给你一些关于这个主题的链接(一些链接涉及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对象添加一个键。该对象将被声明一次且仅声明一次,并且永远不会被覆盖。