模塊加載系統的目的是在JS引入依賴管理，模塊，include等機制。
聽說有人不用，就寫個簡單的教程吧。
先把mass.js下載回來。
然后建立一個HTML頁面，index.html,內容為
<!DOCTYPE HTML>
<html>
<head>
<title>AMD</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.log("測試是否加載成功")
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！</h2>
</body>
</html>
這樣index.html就能正確引用mass.js
我們再用firefox中打開此頁面，在firebug下就把看到日志打印，說明加載成功！
然后我們建立一個新JS文件，放到同一目錄，叫hello.js。那理所當然，這模塊名為hello，當然你可以改別的，最好文件名與模塊名一致。
define("hello", function(){
var helloMass = function(){
alert("hello mass!")
}
var helloAMD = function(){
alert("hello AMD!")
}
var helloWorld = function(){
alert("hello world!")
}
return {
helloMass: helloMass,
helloAMD: helloAMD,
helloWorld: helloWorld
}
});
然后我們修改index.html
<!DOCTYPE HTML>
<html>
<head>
<title>AMD</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.require("./hello", function(obj){
obj.helloWorld();
obj.helloAMD()
obj.helloMass()
})
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！</h2>
</body>
</html>
然后你再用IE，FF或chrome打開，就會看到彈出三個alert了。
這里稍微說一下怎么調用模塊吧。require有兩個參數，第一個是字符串，表示要調用的模塊，第二個是回調函數。比如我要調用aaa.js文件，而aaa.js與mass.js是位於同一目錄下，那么這樣調用。
$.require("./aaa", function(){
});
當然你也可以，".js"后綴不是必需的。
$.require("./aaa.js", function(){
});
"./"表示在當前目錄查找。
如果我要依賴兩個模塊，aaa.js, bbb.js，並且它們都與mass.js在同一目錄下吧。
$.require("./aaa,./bbb", function(a, b){
alert(a+b)//3
});
aaa.js,bbb.js的內容很簡單
//aaa.js
define("aaa", function(){
return 1
});
//bbb.js
define("bbb", function(){
return 1
});
於是頁面改成這樣：
<!DOCTYPE HTML>
<html>
<head>
<title>AMD</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.require("./aaa,./bbb", function(a,b){
alert(a+b)
})
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！</h2>
</body>
</html>
好了，我們再看一下模塊間的依賴。每個模塊應該自行處理依賴。現在有一個ccc.js，它與mass.js也位於同一目錄下，它依賴於上面的aaa.js.
//ccc.js
define("ccc",["./aaa"], function(a){// ./表示aaa與ccc是同一目錄
return a + 10
});
那么我們在頁面調用ccc模塊時,就不用於是會aaa.js,它自行會加載aaa模塊的.
<!DOCTYPE HTML>
<html>
<head>
<title>AMD</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.require("./ccc", function(c){
alert(c)
})
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！</h2>
</body>
</html>
好了，我們再看一下引用其他目錄的js文件是怎么用的。在mass.js的目錄下建立一個ddd文件夾，然后里面再建立一個ddd.js文件，ddd模塊依賴於ccc模塊。
//ddd.js
define("ddd",["../ccc"], function(c){// ../表示在上一級目錄中查找，會點編程的人都懂吧。很普通的常識，不需要學太多東西。
return c+100
});
然后我在頁面上這樣引用它們。
<!DOCTYPE HTML>
<html>
<head>
<title>AMD>/title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.require("./ddd/ddd", function(d){//在當前目錄中ddd目錄找ddd文件
alert(d)
})
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！>/h2>
</body>
</html>
我們再來看遠程文件的調用，肯定所有資源不是放在同一服務器上。比如我有一個模塊是放在http://files.cnblogs.com/rubylouvre/20120830__amd.js中
里面的內容為
//20120830_amd.js
define("remote",function(){
return {
name:"這是一個遠程文件",
address:"位於cnblog的服務器上"
}
})
然后調用時就直接輸入這個URL
<!DOCTYPE HTML>
<html>
<head>
<title>AMD</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="mass.js">
</script>
<script>
$.require("http://files.cnblogs.com/rubylouvre/20120830__amd.js", function(obj){
alert(obj.address)
})
</script>
</head>
<body>
<h2>歡迎加入mass Framework團隊！</h2>
</body>
</html>
全文完，如果你想了解一下怎么加載jQuery，可以看一下老外的文章，畢竟AMD現范在國外很普及了，可以搜到的。或者等我下一篇教程。