require.js

优点：

 1、防止js加载阻塞页面渲染

 2、使用程序调用的方式加载js

require会定义三个变量：define,require,requirejs，其中require === requirejs，一般使用require更简短

1、define 从名字就可以看出这个api是用来定义一个模块 

define(function(){
    function fun1(){
      alert("it works");
    }

    fun1();
})

2、require 加载依赖模块，并执行加载完后的回调函数

require(["js/a"]);

加载js的方式

1、加载本地js

require(["js/a"],function(){
    alert("load finished");
})

第一个参数是数组，即使只有一个也要用数组定义，第二个参数是callback,一个function，用来处理加载完毕后的逻辑，第二个参数非必须。

2、加载非本地js，本地的js也可用

require.config({    //用来配置模块的加载位置，简单点说就是给模块起一个更短更好记的名字
    paths : {
        "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery", "js/jquery"],   //如果远程库没有加载成功，可以加载本地的库
        "a" : "js/a"   
    }
})
require(["jquery","a"],function($){
    $(function(){
        alert("load finished");  
    })
})

3、加载第三方js

通过require加载的模块一般都需要符合AMD规范即使用define来申明模块，但是部分时候需要加载非AMD规范的js，这时候就需要用到另一个功能：shim。

require.config({
    shim: {
        "underscore" : {
            exports : "_";
        }
    }
})

这样配置之后，就可以引用了

require(["underscore"], function(_){
    _.each([1,2,3], alert);
})

全局配置

1、建main.js

require.config({
    paths : {
        "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery", "js/jquery"],        //引入 jquery.js
        "a" : "js/a"           //a.js
    }
})

2、页面引入

<script data-main="js/main" src="js/require.js"></script>