如何引用调用Javascript模块？

我正在使用据我所知的Javascript模块模式和jQuery

我有一个应用程序，它有一个公共和一个管理端。每个都有自己的JS文件，虽然有些功能是共享的，所以我将其提取到一个公共文件中。Gulp将公共+公共文件合并为一个文件，用于公共端，将公共+管理文件合并为一个文件，用于管理端

公共JS文件包括以下内容：

var PublicFoo=（函数（）{
var bar=函数（）{
// ..
};
var init=函数（）{
$button.on（'click'，Common.someCommonThing）；
};
返回{
init:init
};
})();

需要此代码的HTML页面会如下所示：

PublicFoo.init（）；

admin JS文件包含非常类似的内容，还定义了一个

bar（）

函数，并调用相同的

Common

模块函数

var AdminFoo=（函数（）{
var bar=函数（）{
// ..
};
var init=函数（）{
$button.on（'click'，Common.someCommonThing）；
};
返回{
init:init
};
})();

公共JS文件（与public和admin JS共享并结合使用）包括以下内容：

var Common=（函数（）{
var someCommonThing=函数（）{
//做事。
//完成后，我想在调用模块中调用bar（）。
//这不起作用，抛出“未捕获引用错误：未定义条”
bar（）；
};
返回{
一些普通的东西：一些普通的东西，
// ...
};
})();

从

Common

模块中，如何引用调用模块中的函数

我知道打电话的人，但显然

我可能会以某种方式将调用模块的名称作为参数传递给

Common

，并引用它，但这看起来很难看：

//在PublicFoo中
var init=函数（）{
$button.on（'click'，function（）{
普通的东西（PublicFoo）
});
};
//共同
var someCommonThing=函数（调用模块）{
// ...
调用module.bar（）；

当然，我也可以提取

bar（）

调用，然后在调用模块中重新调用，但这看起来也不那么整洁：

//在PublicFoo中
var init=函数（）{
$button.on（'click'，function（）{
普通的，普通的；
bar（）；
});
};
//…在AdminFoo中也是一样

我觉得这一定是JS模块101，一个基本的需求，但我似乎找不到任何关于它的东西，尽管我可能使用了错误的术语进行搜索。或者是我找不到如何做的原因，因为不应该这样做

---

如何从

Common

模块中引用适当的

bar（）

？

将函数传递给其他函数是非常常见且非常地道的JavaScript，因此您可以这样做：

// In PublicFoo
var bar = function() {
    // ..
};

var init = function() {
    $button.on('click', function() {
        Common.someCommonThing(bar)
    });
};

// In Common
var someCommonThing = function(bar) {
    // ...
    bar();
};

我知道。来电者，但显然这是非标准的，不应该使用

此外，它在您的情况下也不起作用，因为调用方是事件处理程序，既不是

PublicFoo

也不是

AdminFoo

我可能会以某种方式将调用模块的名称作为参数传递给Common，并引用它

是的，如果希望

someCommonThing

在完成后执行不同的操作，那么传递对要调用的对象的引用是一种方法。请注意，您确实应该只在对象异步时使用这样的回调，否则以后只需返回并调用

bar

（如上一个代码片段中所示）这要容易得多

如何从

Common

模块中引用相应的

bar（）

如果两个

bar

s可能同时加载到页面中，则无法绕过引用回调的参数

然而，在您的示例中，情况似乎并非如此-在一个页面上，

AdminFoo

扮演

Foo

的角色，而在另一个页面上，

PublicFoo

扮演

Foo

的角色

因此，只需参考

Common

中的

Foo.bar

！让相应的页面填充适当的值，即

var Foo = AdminFoo

在管理页面和

var Foo = PublicFoo

在公共页面上