RequireJS 模块化加载框架使用
RequireJS 是一个遵循 AMD 规范的模块化加载框架
与上文seajs一样，这里简单介绍其相关用法
同样的，首先是下载好 require.js --> http://requirejs.org/docs/download.html#requirejs
AMD规范是预加载，也就是说会马上将所有模块全加载。
写法跟seajs也类似，只不过 当需要包含模块时，一般会将模块名置入第一个参数。而不是直接require 详见
（新版本的也有CMD版require包含依赖的方式，但本质还是一样，下面会提到）
还是举个例子：
目录结构同级
index.html:
注意到这里script标签多了一个data-main属性(加不加后缀js都可以），它标识了引用主模块入口 main.js
（也可以不使用这种引用入口方式，下边会介绍另一种方式，注意啦~)
<!DOCTYPE html> <html> <head> <title>require</title> <style type="text/css"> </style> </head> <body> <script type="text/javascript" data-main='main' src="./require.js"></script> </script> </body> </html>
main.js:
将两个模块置入参数1，并以回调的方式传入使用
define(['main1','main2'],function(main1,main2){ console.log('module of main:'); main1.say(); main2.say(); });
main1.js:
define(function(require,exports,module){ console.log('module of main1:'); module.exports = { say: function(){ console.log('main1--hello'); } }; });
main2.js:
define(function(require,exports,module){ console.log('module of main2:'); return { say: function(){ console.log('main2--hello'); } }; });
浏览器打开index.html 可以发现结果：
顺序乱了是不是
其实这就是因为AMD规范预先加载的规则，预先把所有依赖都执行了（虽然我们还没用到）
而且这加载是并行的，（默认情况下）main1和main2不分先后。
假设 main.js文件因网络问题加载延迟后，就有可能出现以下结果
module of main2:
module of main1:
module of main:
...
不过，我们也可以为其什么依赖关系，比如main1依赖main2,则就能保证“所谓的顺序”-- 先有main2才有main1
比如将index.html修改成
<!DOCTYPE html> <html> <head> <title>require</title> <style type="text/css"> </style> </head> <body> <script type="text/javascript" src="./require.js"></script> <script type="text/javascript"> require.config({ shim:{ 'main1':{ deps: ['main2'] } } }); require(['main'],function(main){ console.log(main.num); }); </script> </script> </body> </html>
main.js:
define(['main1','main2'],function(main1,main2){ console.log('module of main:'); main1.say(); main2.say(); return {num:10}; });
这时的结果：
上面提到了requirejs也更新了遵循CMD规范的策略，但表面上遵循了，本质上还是AMD的
为什么这么说呢？ 引自：
所以要用requirejs就老老实实使用AMD的，如果想使用CMD的方式，就用seajs吧