Question

我的应用程序使用此主对象，因为您看到大部分工作都是在此方法中完成的。问题是如果我想将它全部写在一个文件中，这个对象会变得太大。并且代码很难调试。有什么方法可以用来将这个对象分成多个文件（比如一个文件中的每个函数）？我还希望能够从这些函数中访问和更改displayArray，userOptions和查询变量任何形式的建议表示赞赏。谢谢：）

application = {
    displayArray : new Array(),
    userOptions : new Array(),
    query : '', 
    status : false,

    initilize : function () {
        //its going to initialize displayArray, userOptions and status.
    },

    loadOptions : function () {
        //this function builds userOptions array
    },

    JSONConverter : function () {
      //this function uses query to builds displayArray  
    },

    display : function () {
       //this function will use displayArray to build HTML elements on page
    },

};

Answer 1

例如：

 // file: application.js
(function (window, undefined) {
  var application = {
     // ...
  };
  window['application'] = application;
}(window));

// file: application-module1.js
(function (application, window, undefined) {
  var module_foo = {
     // ...
  };
  application['module_foo'] = module_foo;
}(application, window));

// file: application-module2.js
(function (application, window, undefined) {
  var module_bar = {
     // ...
  };
  application['module_bar'] = module_bar;
}(application, window));

Answer 2

你可以！编写几个.js脚本，然后将它们嵌入到html文件中，如下所示：

<head>
    <script type="text/javascript" src="script1.js"></script>
    <script type="text/javascript" src="script2.js"></script>
</head>

This是如何做到的一个很好的例子。（source）

Answer 3

abstract.js

function abstractClass(construct_options){{

}

someObject.js

someObject.prototype = new abstractClass();
someObject.prototype.foo = function(){


}

otherObject.js

otherObject.prototype = new abstractClass();
otherObject.prototype.toe = function(){


}

你可以这样做：

var a = new someObject();
var b = new otherObject();

Answer 4

您可以将所有功能移动到单独的文件中，并将它们添加到应用程序的原型中。

文件initialize.js：

function initialize () {
    this.displayArray =  new Array();
}

文件initilize.js：

function() Application{
    this.userOptions = new Array();
    this.query = '';
    this.status = false;
    this.initialize();
}

Application.prototype.initialize = initialize;

此解决方案将使用外部文件中的所有函数来规划您的全局名称空间。因此，如果它是一个更大的项目，您应该开始使用和requirejs之类的AMD解决方案：

文件initialize.js：

define(function () {
    return function () {
        this.displayArray =  new Array();
    }
})

文件initilize.js：

define(['initialize'], function (initialize) {
    function() Application{
        this.userOptions = new Array();
        this.query = '';
        this.status = false;
        this.initialize();
    }

    Application.prototype.initialize = initialize;
    return Application;
})

Answer 5

您可以在一个文件中定义应用程序“class”，然后使用prototype将每个函数添加到单独的文件中，例如

var application = function () { };

application.prototype.method1 = function (arg1) {
window.alert(arg1);
}

var a = new application();
a.method1('Hello, World!');

如何将我的javaScript代码分成多个文件？

5 个答案: