1.AMD規(guī)范
（1）define 定義模塊
（一）define 定義獨立模塊
如果被定義的模塊是一個獨立模塊敢辩，不需要依賴任何其他模塊，可以直接用define方法生成。
define({ method1: function() {}, method2: function() {}, });
上面代碼生成了一個擁有method1、method2兩個方法的模塊。
另一種等價的寫法是银觅，把對象寫成一個函數(shù)，該函數(shù)的返回值就是輸出的模塊坏为。
define(function () {
return {
method1: function() {},
method2: function() {},
};
});
(二）非獨立模塊
如果被定義的模塊需要依賴其他模塊究驴，則define方法必須采用下面的格式。
define(['module1', 'module2'], function(m1, m2) { ... });
2.requireJS config 方法
**（1）paths **
paths參數(shù)指定各個模塊的位置匀伏。這個位置可以是同一個服務(wù)器上的相對位置洒忧，也可以是外部網(wǎng)址」坏撸可以為每個模塊定義多個位置熙侍，如果第一個位置加載失敗，則加載第二個位置履磨，上面的示例就表示如果CDN加載失敗蛉抓，則加載服務(wù)器上的備用腳本。需要注意的是剃诅，指定本地文件路徑時巷送，可以省略文件最后的js后綴名。
**（2）baseUrl **
baseUrl參數(shù)指定本地模塊位置的基準(zhǔn)目錄矛辕，即本地模塊的路徑是相對于哪個目錄的笑跛。該屬性通常由require.js加載時的data-main屬性指定。
（3）shim
有些庫不是AMD兼容的如筛，這時就需要指定shim屬性的值堡牡。shim可以理解成“墊片”抒抬，用來幫助require.js加載非AMD規(guī)范的庫杨刨。
3.shim 加載非AMD模塊
（1）形式1
** b.js**
var hello = function () {//
console.log('hello 1');//
};
hello 為b1.js 暴露的全局變量
main.js
require.config({
baseUrl:'js/',
shim:{
'b':{
exports:'hello', //hello 與b中暴露的全局變量一致
deps:['math']
}
},
paths:{
"a":"a",
'jquery':'jquery-3.1.0.min',
'math':'math'
},
})
require(['jquery',"a"],function ($) {
$(function () { alert('load finished');
})
});
a.js 依賴于b1.js(即a.js 中調(diào)用b.js 的函數(shù))
a.js
define(['b'], function(b){
function fun1(){
b();
console.log(b);
};
fun1();
})；
輸出結(jié)果
瀏覽控制臺輸出：
1
function () {//
console.log('hello 1');//
}
（2）形式2
b.js
var Bobj = (function () {
var name = 'scarlet';
var hello = function () {
console.log('hello '+name);
}
return{
hello:hello
}
})();
main.js
require.config({
baseUrl:'js/',
shim:{
'b':{
exports:'Bobj',//Bobj 于b.js 暴露的全局變量名一致
deps:['math']
} },
paths:{
"a":"a",
'jquery':'jquery-3.1.0.min',
'math':'math' },})
require(['jquery',"a"],function ($) {
$(function () {
alert('load finished');
})});
a.js
define(['b'],
function(b){
function fun1(){
b.hello(); //b;
console.log(b);
};
fun1();
})
控制臺輸出
....
hello scarlet
Object
(3)形式3
b.js
var hello3 = function () {
console.log('hello 3');
}();
main.js
require.config({
baseUrl:'js/',
shim:{
'b':{
exports:'hello3',
deps:['math']
}
},
paths:{
"a":"a",
'jquery':'jquery-3.1.0.min',
'math':'math'
},})
require(['jquery',"a"],function ($) {
$(function () {
alert('load finished');
})});
a.js
define(['b'], function(b){
function fun1(){
b;
console.log(b);
};
fun1();
})
控制臺輸出
hello 3
undefined
總結(jié)：
exports :是指引用的js文件暴露的全局變量擦剑。也是外部js引用是使用的變量（可能是函數(shù)妖胀，也可能是對象）芥颈。
4.依賴（例如 b.js 依賴 math.js ）
b.js 是非AMD規(guī)范的js ，math.js 是自定義的AMD規(guī)范的js赚抡。b.js 依賴于math.js (b.js 的hello 函數(shù)調(diào)用 math.js 的rev函數(shù))
b.js
var Bobj = (function () {
var name = 'scarlet';
var hello = function (math) {
console.log("b.js ___________start");
console.log('hello '+name);
console.log(math.rev(name+' hello'));
console.log("b.js ____________finshed");
}
return{
hello:hello
}
})();
math.js
define(function () {
var add = function (a,b) {
return a+b;
}
var sub = function (a,b) {
return a-b;
};
var rev= function (str) {
var revS = "";
for(var i = str.length-1;i >=0;i--){
revS +=str[i];
}
return revS;
};
return {
add:add,
sub:sub,
rev:rev
};
})
main.js
/** * Created by lxy_920912 on 16/9/8. */
require.config({
baseUrl:'js/',
shim:{
'b':{
exports:'Bobj',
deps:['math']
}
},
paths:{
"a":"a",
'c':'c',
'jquery':'jquery-3.1.0.min',
'math':'math'
},
})
require(['jquery',"a",'c','math','b'],function ($,a,c,math,b) {
$(function () {
a.fun1();
c.fun1();
a.fun3(c);
alert('load finished');
b.hello(math)
})
});
5循環(huán)依賴
a.js 依賴于c.js ,c.js 依賴于 a.js.
(a.js 的fun3 調(diào)用c.js 的fun1,c.js 的fun1 調(diào)用a.js 的fun1)
a.js
define(['jquery','math','text!input.txt','b','require','c'], function($,math,input,b,c){
var fun1 = function (){
console.log('_______________a fun1__________________________');
console.log("add: "+math.add("hello "," scarlet")+"\n sub: "+math.sub(5,23));
console.log(math.rev('ABCDEFG'));
b.hello();
console.log('_______________a fun1 finished__________________________'); };
var fun2 = function fun2(input) {
var ptext =document.createTextNode(input) ;
document.body.appendChild(ptext);
//require('c').fun1();
console.log('a fun2 finished'); };
var fun3 = function (c) {
console.log('a fun3______________')
//var c = require('c');
c.fun1();
console.log('a fun3 finished_______');
}
fun2(input);
return {
fun1:fun1,
fun2:fun2,
fun3:fun3
}
})
c.js
define(['require','a'],function (require,a) {
var fun1 = function fun1() {
require("a").fun1();
console.log('c fun1 finished');
}
return {
fun1:fun1
}
})
main.js
require.config({
baseUrl:'js/',
shim:{
'b':{
exports:'Bobj',
deps:['math']
} },
paths:{
"a":"a",
'c':'c',
'jquery':'jquery-3.1.0.min',
'math':'math'
},})
require(['jquery',"a",'c','math','b'],function ($,a,c,b) {
$(function () {
a.fun1();
c.fun1();
a.fun3(c);
alert('load finished');
})
});
如果你定義一個循環(huán)依賴關(guān)系 (a 依賴c 并且 c 依賴 a)爬坑，那么當(dāng)c的模塊構(gòu)造函數(shù)被調(diào)用的時候，傳遞給他的a會是undefined涂臣。 但是c可以在a模塊在被引入之后通過require(‘a(chǎn)’)來獲取a (一定要把require作為依賴模塊盾计，RequireJS才會使用正確的 context 去查找 a):
‘
’
