如何將我的javaScript代碼打碎成多個文件？

我的應用程序使用這個主要的對象，因爲你看到大部分的工作是在這個方法中完成的。問題是如果我想將它全部寫入一個文件，則此對象將變得太大。代碼將很難調試。有什麼方法可以用來將這個對象分割成多個文件（就像一個文件中的每個函數一樣）？我也希望能夠訪問和更改這些函數中的displayArray，userOptions和查詢變量。
各種建議表示讚賞。謝謝:)如何將我的javaScript代碼打碎成多個文件？

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 
    }, 

};

來源

2012-09-02 Iman Mohamadi

你可以！寫幾個劇本名爲.js，然後將它們嵌入在像這樣的HTML文件：

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

This是如何做到這一點的好例子。（source）

來源

2012-09-02 11:58:05 lolopop

例如：

// 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));

來源

2012-09-02 11:58:54 xdazz

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();

來源

2012-09-02 11:59:10 jancha

我喜歡抽象類的想法謝謝。 –

您可以將所有功能集成到單獨的文件，並將它們添加到您的應用程序的PROTOTYP。

文件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;

該解決方案將polute全局名字空間與外部文件中的所有功能。所以，如果它的一個大項目，你應該開始使用和AMD的解決方案就像requirejs：

文件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; 
})

來源

2012-09-02 12:03:55

非常感謝，你幫了我很多，我喜歡使用nameSpaces的想法。 –

你可以在一個文件中定義應用程序的「類」，然後使用原型將每個函數添加到單獨的文件中，例如

var application = function() { }; 

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

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

來源

2012-09-02 12:12:12 Netricity

如何將我的javaScript代碼打碎成多個文件？

回答

相關問題