標籤:style blog http color io java ar strong 檔案
今天去學習了一下javascript的模組化編程,寫了個簡單的例子。
———————————————— 這是我的第一篇技術性的小博文,希望和大家相互交流 ————————————————
這個列子我打算分兩個部分羅列:
1.檔案地圖
2.原始碼 demo.html:
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>模組載入簡例</title> 6 <script data-main="main" type="text/javascript" src="require.js"></script> 7 8 </head> 9 <body>10 空頁面11 </body>12 </html>
a.js
var Radd = function(numA,numB){ return numA + numB;}
b.js
//減法var Rsub = function(numA,numB){ return numA - numB;}//除法對象function glinDiv(divisor){ this.divisor = divisor; this.Rdiv = function(num){ return num / this.divisor; }}
c.js
//乘法var Rmul = function(num,ples){ return num * ples;}//執行個體化除法對像myDiv = new glinDiv(4); /*==== 此處依賴 b.js 中定義的 glinDiv 對象 ====*/
main.js
//模組載入路徑配置require.config = { "a":"a", "b":"b", "c":"c"}//模組載入的順序及回呼函數-----------(其中“c”必須在“b”之後,因為“c”中的 “//執行個體化除法對像” 依賴“b”中的 “//除法對象”)require(["a","b","c"],function(a,b,c){ var num01 = 10; var num02 = 20; var pels = 2; //調用載入好的模組中的函數進行運算 var tol = Rsub(Radd(num01,num02),Rmul(num01,pels)); alert(myDiv.Rdiv(tol));//彈窗test });
require.js(工具庫,自己百度)
結語:歡迎各位同學交流指導,特別希望得到一些好的博文表述和展示方式方面的建議!
require.js【模組化編程】- 模組載入簡例