JavaScript模块化

标签：

js通过立即执行函数可以进行模块化。

1 var myModule = (function(){
2      //私有成员
3      var ...
4      
5      return {
6            //公有成员
7      };      
8 })();

但是涉及复杂模块依赖关系上述方式就需要改造了。

require.js是遵循AMD规范的JavaScript模块化库，。下面展示了如何使用require.js进行js模块化。

1.定义一个模块mod1.js

1 define(function(){
2     return {a: 3};
3 });

2.定义需要依赖的模块mod2.js

1 define([‘mod‘],function(m1){
2     var a, b = 2, c = 3;
3     a = c*m1.a;
4     return {
5         a: a,
6         b: b
7     };
8 });

define方法用来定义模块，有两个参数。第一个参数是该模块依赖的模块数组；第二个参数是一个回调函数，在函数中定义模块，return的部分是模块暴露出来的。回调函数的参数对应指向依赖模块数组。

3.定义执行入口main.js

1 require([‘mod2‘],function(m2){
2      alert(m2.a*m2.b);
3 });

require定义了Javascript从哪里开始执行，如3执行回调函数，发现需要引用mod2就会加载mod2，同理，加载mod1。

如此，require.js避免了多个模块依赖时，复杂的加载顺序问题。

参考：

慕课网阿当大话西游之WEB组件

JavaScript模块化

标签：

原文地址：http://www.cnblogs.com/feitan/p/5409333.html