Question

我的主应用程序根据访问过的“页面”加载javascript文件：

var AdminConsole = (function() {
    function openPage(folder, template) {
        $.getScript('viewmodels/' + template + '.js')
            .done(function() {
                console.log(template + " script loaded.");
            });
    }
    function test() {
        // do something ...
    }
})();

$.getScript()中加载的javascript如下所示：

var UserPermissions = (function() {
    // try to call test()
})();

我的问题是，如何在AdminConsole.test()内致电UserPermissions()？

当我尝试AdminConsole.test()时，它表示AdminConsole未定义。当我尝试test()时，测试未定义。

Answer 1

分配给AdminConsole的值是该匿名函数返回的值。由于您没有返回任何内容，因此undefined。

相反，您应该导出公共方法/属性：

var AdminConsole = (function() {
    // ... (private data)
    return { // Export public data to the outside
        test: test,
        openPage: openPage
    };
})();

如果您不需要私人数据，您还可以考虑更简单的

var AdminConsole = {
    test: function(){ /*...*/ },
    openPage: function(){ /*...*/ }
};

Answer 2

AdminConsole似乎是调用函数的结果。如果该函数没有return，则AdminConsole将是未定义的。也许你想要这个：

AdminConsole = {
    openPage: ...
    test: ...
}

但您可能想要的是使用Browserify或RequireJS提供的模块。

Answer 3

在您的代码段中，AdminConsole是一个自动执行的匿名函数。换句话说，它等于(function () {/* your code*/})()返回的任何内容。在上面的例子中，你不会返回任何东西（你只是在匿名函数中有函数），所以AdminConsole == undefined。这些功能是私人的。例如，

function myPrivateData () {
    this.data = "public";
    var nobodyCanSee = "private";
}
var test = new myPrivateData();
// test.data => "public"
// test.nobodyCanSee => undefined

这和你的情况一样。您的内部函数都没有附加到匿名函数，因此它们在该函数的范围之外是不可见的。

如果您想访问AdminConsole中的功能，可以将其设为对象：

var adminConsole = {
    openPage: function () {
        // etc
    },
    test: function () {
        // etc
    }
}

使用此结构，您可以使用test调用adminConsole.test()。

从动态加载的内部函数调用Javascript函数

3 个答案: