Javascript 如何使用显示模块模式将一个JS模块的公共方法调用到另一个JS模块中?
我一直在试验Javascript的暴露模块模式,但我不太明白是否以及如何将一个模块的公共方法调用到另一个模块中。假设我有这两个模块(代码简化): 1) 模块AJavascript 如何使用显示模块模式将一个JS模块的公共方法调用到另一个JS模块中?,javascript,revealing-module-pattern,Javascript,Revealing Module Pattern,我一直在试验Javascript的暴露模块模式,但我不太明白是否以及如何将一个模块的公共方法调用到另一个模块中。假设我有这两个模块(代码简化): 1) 模块A var lazyload = ( function() { function loadDefault() { $('.lazy').load(); } return { loadDefault: loadDefault } })(); 2) 模块B var newp
var lazyload = ( function() {
function loadDefault() {
$('.lazy').load();
}
return {
loadDefault: loadDefault
}
})();
2) 模块B
var newposts = ( function() {
function addNewPosts() {
$('.posts').append();
}
});
如何将模块A中的loadDefault()
方法调用到模块B中的addNewPosts()
方法?不确定这是否与此有关,但可能值得一提的是,我使用的是Webpack,因此在我的主.js文件中,我导入了两个模块:
import './ModuleA';
import './ModuleB';
如何将模块A中的loadDefault()
方法调用到模块B中的addNewPosts()
方法
如果您使用的是旧式显示模块模式,那么您应该使用lazyload.loadDefault()
。但是继续读
不确定这是否与此有关,但可能值得一提的是,我使用的是Webpack,因此在我的主.js文件中,我导入了两个模块:
import './ModuleA';
import './ModuleB';
那么你就不想使用RMP了。相反,请使用导出:
lazyload.js
:
export function loadDefault() {
$('.lazy').load();
}
import {loadDefault} from './ModuleA';
export function addNewPosts() {
loadDefault();
$('.posts').append();
}
export default function loadDefault() {
$('.lazy').load();
}
newposts.js
:
export function loadDefault() {
$('.lazy').load();
}
import {loadDefault} from './ModuleA';
export function addNewPosts() {
loadDefault();
$('.posts').append();
}
export default function loadDefault() {
$('.lazy').load();
}
或者,如果希望导出的函数为默认函数:
lazyload.js
:
export function loadDefault() {
$('.lazy').load();
}
import {loadDefault} from './ModuleA';
export function addNewPosts() {
loadDefault();
$('.posts').append();
}
export default function loadDefault() {
$('.lazy').load();
}
…然后导入
import loadDefault from './ModuleA';
RMP是解决JavaScript没有模块问题的一种方法。一旦您使用了实际的模块(在ES2015中引入),您就不再需要RMP(用于模块)。如果您使用
import
语法来引入您想要调用的函数,您必须在模块中导出它们:工作正常且外观良好,我们将对此进行进一步研究。谢谢