requireJS

一、require优势

使用块级作用域来声明function防止污染全局变量，声明不同js文件之间的依赖，可以按需额、并行、延时载入js库，代码以模块化的方式组织

二、文件引入

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

js放到body的末尾，防止js阻塞浏览器渲染，使用async:true异步加载，避免网页失去响应

三、主文件配置

require.config({
    baseUrl:"js",//设置根路径
    paths:{
        hello:"hello",
        jquery:["http://libs.baidu.com/jquery/2.0.3/jquery","jquery"]//远程模块没有加载成功，加载本地模块
    },//设置路径
    shim:{
        hello:{
            deps:['jquery'],//加载依赖关系数组
            exports:"hello"//暴露一个变量
            init:function(){
                return{
                    hello:hello,
                    hello2:hello2
                }
            }//暴露多个变量
        }
    }//使用没有函数依赖并初始化函数（paths里找到属于它的模块，这部分忽略）
    map:{
        '*':{'jquery':'jquery-private'},
        'jquery-private':{'jquery':'jquery'}    
    }//使用这个模块名时最先执行jquery-private，map可以解决同一模块不同版本问题
})

四、无主与有主模块

define('jquery',[],function(){...});//有主模块，引用时不能修改模块名字
define([],function(){...});//无主模块，引用时可以自定义模块名字

定义有主模块主要是为了让系统只载入它们一次

五、内部机制

requireJS加载的每个模块作为script Tag,使用head.appendChild()方法，在模块的定义时，requireJS等到所有的依赖都加载完毕，计算出模块正确调用顺序，然后依次调用。