Require.js

由于加载文件越多，网页失去响应的时间就会越长；其次，由于js文件之间存在依赖关系，因此必须严格保证加载顺序，依赖性最大的模块一定要放到最后加载，当依赖关系很复杂的时候，代码的编写和维护都会变得困难。

所以采用reuire.js库实现js文件的异步加载，避免网页失去响应；管理模块之间的依赖性，便于代码的编写和维护。

1.引入

在代码底部<script src="js/require.js"></script>
或<script src="js/require.js" defer async="true" ></script>
进行异步加载，defer是为了IE兼容，可以添加data-main属性设置入口文件（每个.html文件都需要一个入口文件）

2.若主模块（即入口文件）依赖于其他模块，这时就要使用AMD规范定义的的require()函数。

*require()函数接受两个参数。第一个参数是一个数组，表示所依赖的模块，上例就是[‘moduleA’, ‘moduleB’, ‘moduleC’]，即主模块依赖这三个模块；第二个参数是一个回调函数，当前面指定的模块都加载成功后，它将被调用。加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块。主模块的代码就写在回调函数中。

3.模块的加载

使用require.config()方法，可以对模块的加载进行自定义。
require.config()写在主模块的头部。参数是一个对象，这个对象的paths属性指定各个模块的加载路径。（这些文件路径默认与main.js在同一个目录）

require.config({
　　　　paths: {
　　　　　　"jquery": "jquery.min",
　　　　　　"underscore": "underscore.min",
　　　　　　"backbone": "backbone.min"
　　　　}
　　});

4.模块的写法

如果一个模块不依赖其他模块，那么可以直接定义在define()函数之中。
假定现在有一个math.js文件，它定义了一个math模块。那么，math.js就要这样写：

define(function (){
　　　　var add = function (x,y){
　　　　   return x+y;};
　　　　return {add: add};
　　});

则在主模块文件的加载方法为

require(['math'], function (math){
　　　　alert(math.add(1,1));
　　});

5.非规范模块的加载

这样的模块在用require()加载之前，要先用require.config()方法，利用shim属性定义它们的一些特征。
具体来说，每个模块要定义
（1）exports值（输出的变量名），表明这个模块外部调用时的名称；
（2）deps数组，表明该模块的依赖性。
如jquery的插件

shim: {
　　　　'jquery.scroll': {
　　　　　　deps: ['jquery'],
　　　　　　exports: 'jQuery.fn.scroll'
　　　　}
　　}