闭包之间怎么引用模块呢?
第一个闭包中定义模块
(function( ){
var modA={a:100,b:200};
}).call(this);
第二个闭包要引用modA模块
(function(p){
var root=p;
console.log(modA);
})(window);
9 回复
(function( ){
var modA={a:100,b:200};
return modA;
}).call(this);
(function(p){
var root=p;
console.log(modA);
})(window);
ReferenceError: modA is not defined
console.log(modA);
var modA = (function() {
var modA = {
a: 100,
b: 200
};
return modA;
}).call(this);
(function(p, modA) {
var root = p;
console.log(modA);
})(window, modA);
var exports = {};
(function(exports) {
exports.modA = function() {}
})(exports)
(function(exports) {
console.log(exports.modA);
})(exports)
@joesonw 这种有点象网易的写法
NTES = {};
NTES.namespace = function() {
var a = arguments,
o = null,
i, j, d, l;
for (i = 0, l = a.length; i < l; i++) {
d = ("" + a[i]).split(".");
o = window.NTES;
for (j = d[0] == "NTES" ? 1 : 0; j < d.length; j = j + 1) {
o[d[j]] = o[d[j]] || {};
o = o[d[j]]
}
}
return o
};
(function($) {
NTES.namespace("NTES.plugin");
var util = NTES.util,
extend = util.extend,
plugin = NTES.plugin,
addPlugin = function(name, pl) {
plugin[name] = pl;
return pl
},
getPlugin = function(name) {
return plugin[name]
};
extend($, {
addPlugin: addPlugin,
getPlugin: getPlugin
})
})(NTES);
(function($) {
NTES.namespace("NTES.util.DOM");
var util = NTES.util,
extend = util.extend,
insertAfter = function(a, b) {
var c = b.parentNode;
if (c.lastChild == b) {
c.appendChild(a)
} else {
c.insertBefore(a, b.nextSibling)
}
},
removeElement = function(a) {
var b = a.parentNode;
b && b.removeChild(a)
},
setCss = function(elm, options, unit) {
unit = unit == undefined ? "px" : "";
var name, style = elm.style;
for (name in options) {
if (options.hasOwnProperty(name)) {
style[name] = options[name] + unit
}
}
return elm
},
hide = function(elm) {
return setCss(elm, {
display: "none"
}, "")
},
show = function(elm) {
return setCss(elm, {
display: ""
}, "")
};
extend(util.DOM, {
insertAfter: insertAfter,
removeElement: removeElement,
css: setCss,
show: show,
hide: hide
})
})(NTES);
其中 NTES.namespace(“NTES.xxMod”); 这一句是用来做什么的, 只是声明一下吗?
@alsotang 恩,其实我只是觉得这个其实跟闭包关系不大,感觉更应该是如何组织代码的问题。一般我在没有用打包工具(例如webpack或者browserify)写前端代码的时候,如果需要分开不同的js文件组织项目,就会碰到这个问题。
一般我会简单这样写: moduleA.js
var App = (function(m) {
m.func1 = function() {
// xxxx
}
return m;
})(App || {});
然后假如我有一个moduleB.js需要用到moduleA.js,那moduleB.js像这样
var App = (function(m) {
m.func2 = function() {
//m.func1();
}
return m;
})(App || {});
然后判断添加一个判断环境的:
(function() {
if (typeof module === 'object' && typeof module.exports === 'object') {
module.exports = App;
} else if (typeof define === 'function' && define.amd) {
define(App);
} else {
window.App = App;
}
})();
最后简单粗暴的把文件concat起来就可以了。