JavaScript学习笔记 (八）—— require
require.js
1、是什么？
对js文件进行管理，模块加载器
RequireJS的基本思想是，通过define方法，将代码定义为模块；通过require方法，实现代码的模块加载
2、为什么？
多个js文件依次加载时，浏览器会停止网页渲染，并且js文件存在依赖关系，要保证加载顺序（如依赖性越大的放在后面）会很复杂，而用require可以对js文件进行模块化管理、加载，实现js文件的异步加载，避免网页失去响应，管理模块间的依赖性，也便于代码的编写与维护。
3、怎么用？
① <script data-main=“js/main” src=“js/require.js" ></script>
//下载一个require.js文件,将文件放于js子目录中。
data-main 属性作用是指定网页程序主模块，即 启动文件 ，这个文件会第一个被require.js下载，可将main.js简写成main。
② define方法：定义模块（分两种情况：a、定义独立模块-即不依赖其他模块；b、定义非独立模块）
a、独立模块
define（function( ){
return {
method1:function( ){ };
method2:function( ){ };
} ;
}); //define定义的模块可以返回任何值，不限于对象。
b、非独立模块
define （[‘module1’,’module2’],function(module1,module2 ) {
return {
method:function( ){
module1.methodA( );
module2.methodB( );
}
};
}); //代码表示新模块返回一个对象，对象的method方法是外部调用的接口，method方法内部调用module1模块的methodA方法和module2模块的methodB方法。
ps: 回调函数必须返回一个对象，这个对象即对应的模块。
若依赖模块非常多，可这样写：
define（function（require）{
var dep1 = require(‘dep1'),
dep2 = require(‘dep2’),
dep3 = require(‘dep3’),
………...
});
③ require方法：调用模块
主模块依赖于其他模块，这时需要用AMD规范定义的require（）函数：
//main.js
require([‘moduleA',‘moduleB’,‘moduleC’],function(moduleA,moduleB,moduleC){
//业务代码
})；
第一个参数是表示依赖关系的数组，第二个参数是回调函数，当前面的模块加载成功后，将被调用
AMD小结 ：
define和require这两个定义模块、调用模块的方法，合称为AMD模式。它的模块定义的方法非常清晰，不会污染全局环境，能够清楚地显示依赖关系。
AMD模式可以用于浏览器环境，并且允许非同步加载模块，也可以根据需要动态加载模块。
④ 配置 require.config( )：
写于主模块main.js的头部，参数就是一个对象。config方法的参数对象主要有：
a、paths:指定各个模块的位置。
require.config({
paths:{
“jquery”:"jquery.min”,
“underscore”:"underscore.min”,
“backbone”:“backbone.min"
}
});
b、baseUrl:指定本地模块位置的基准目录。
require.config({
baseUrl : js/lib
});
c、shim:用来加载非AMD规范的库
require.config({
paths:{
“backbone”:”vendor/backbone”,
“underscore”:”vendor/underscore"
},
shim:{
“backbone”:{
deps: [“underscore”],
exports:”backbone"
} ,
“ underscore”:{
exports:”_"
}
}
});
//代码中的backbone和underscore就是非AMD规范的库。shim指定它们的依赖关系（backbone依赖于underscore），以及输出符号（backbone为“Backbone”，underscore为“_”）。
⑤ require.js 插件
domready 插件— 可以让回调函数在页面DOM结构加载完成后再运行
require([‘domready!’],function(doc){
//called once the DOM is ready
} );
text 和 image 插件 —允许require.js 加载文本和图片文件。
define([
' text!review.txt',
‘image!cat.jpg'
],
function(review.cat){
console.log(review);
document.body.appendChild(cat);
}
);
类似的插件还有json和mdown，用于加载json文件和markdown文件。