如何從另一個模塊JS對象中的JavaScript對象訪問函數和變量？

Question

我正在后端使用JavaScript和PHP構建應用程序。 它將允許用戶構建用於擴展應用程序的插件/模塊。

基於JavaScript結構，如var WebDevApp = {}下的對象

我如何才能使包含其中自己的JavaScript文件的其他模塊進入頁面，如何能夠在下面的我的核心代碼中訪問那里的對象，並允許他們在那里的代碼中訪問該對象。

例如，如果加載了一個名為Bookmarks的模塊，則它將具有這樣的JS對象...

var WebDevApp.Bookmarks = {

}  

在下面的核心代碼中，我可以像這樣從上方調用函數...

WebDevApp.Bookmarks.getJsonData();

在模塊JS代碼內部，我應該能夠從核心代碼中調用諸如此類的東西...

WebDevApp.cache.varFromCoreJsObjectCalledFromModule

---

我想要模塊擴展的核心JS目標代碼...

var WebDevApp = {

    modulesJson: '',

    cache: {
        templates: {},
    },

    init: function() {

    },

    events: function() {

        // all the dom devents from other JS files ................
        WebDevApp.Bookmarks.domEvents();

        WebDevApp.OtherModuleName.domEvents();
    },


    loadJSONData: function() {
        // load JSON Data from the other Module JS files
        WebDevApp.Bookmarks.loadJSONData();

        WebDevApp.OtherModuleName.loadJSONData();
    },
}


// run app
jQuery(document).ready(function($) {
    WebDevApp.init();
});

Answer 1

我認為您可能要確保您的核心模塊沒有與其他模塊緊密耦合。 您可以通過確保向核心注冊其他模塊來做到這一點（假設存在一個模塊Array屬性）：

WebDevApp.modules.push(WebDevApp.Bookmarks);

然后在事件和loadJSONData函數中，您將具有如下邏輯：

WebDevApp.modules.forEach(function(mod){
    mod.domEvents();
});