隨著網站逐漸變成互聯網應用程序嵌入網頁的Javascript代碼越來越龐大越來越復雜
網頁越來越像桌面程序需要一個團隊分工協作進度管理單元測試等等……開發者不得不使用軟件工程的方法管理網頁的業務邏輯
JavaScript模塊化編程已經成為一個迫切的需求理想情況下開發者只需要實現核心的業務邏輯其他都可以加載別人已經寫好的模塊
但是JavaScript不是一種模塊化編程語言它不支持類（class）更遑論模塊（module）了（正在制定中的ECMAScript標准第六版將正式支持類和模塊但還需要很長時間才能投入實用）
JavaScript社區做了很多努力在現有的運行環境中實現模塊的效果本文總結了當前Javascript模塊化編程的最佳實踐說明如何投入實用雖然這不是初級教程但是只要稍稍了解Javascript的基本語法就能看懂
一原始寫法
模塊就是實現特定功能的一組方法
只要把不同的函數（以及記錄狀態的變量）簡單地放在一起就算是一個模塊
function m（）{
//… }
function m（）{
//…
}
上面的函數m（）和m（）組成一個模塊使用的時候直接調用就行了
這種做法的缺點很明顯污染了全局變量無法保證不與其他模塊發生變量名沖突而且模塊成員之間看不出直接關系
二對象寫法
為了解決上面的缺點可以把模塊寫成一個對象所有的模塊成員都放到這個對象裡面
var module = new Object（{
_count :
m : function
（）
{ //…
}
m : function
（）
{ //…
}
}
）
上面的函數m（）和m（）都封裝在module對象裡使用的時候就是調用這個對象的屬性
modulem（）
但是這樣的寫法會暴露所有模塊成員內部狀態可以被外部改寫比如外部代碼可以直接改變內部計數器的值
module_count = ;
三立即執行函數寫法
使用立即執行函數（ImmediatelyInvoked Function ExpressionIIFE）可以達到不暴露私有成員的目的
var module = （function（）{
var _count = ;
var m = function（）{
//… };
var m = function（）{
//… };
return { m : m m : m };
}）
（）
使用上面的寫法外部代碼無法讀取內部的_count變量
（module_count） //undefined
module就是Javascript模塊的基本寫法下面再對這種寫法進行加工
四放大模式
如果一個模塊很大必須分成幾個部分或者一個模塊需要繼承另一個模塊這時就有必要采用放大模式（augmentation）
var module = （function （mod）{
modm = function （） {
//… };
return mod;
}）
（module）
上面的代碼為module模塊添加了一個新方法m（）然後返回新的module模塊
五寬放大模式（Loose augmentation）
在浏覽器環境中模塊的各個部分通常都是從網上獲取的有時無法知道哪個部分會先加載如果采用上一節的寫法第一個執行的部分有可能加載一個不存在空對象這時就要采用寬放大模式
var module = （ function （mod）{
//…
return mod;
}）
（windowmodule || {}）
與放大模式相比寬放大模式就是立即執行函數的參數可以是空對象
六輸入全局變量
獨立性是模塊的重要特點模塊內部最好不與程序的其他部分直接交互
為了在模塊內部調用全局變量必須顯式地將其他變量輸入模塊
var module = （function （$ YAHOO） {
//… }）
（jQuery YAHOO）
上面的module模塊需要使用jQuery庫和YUI庫就把這兩個庫（其實是兩個模塊）當作參數輸入module這樣做除了保證模塊的獨立性還使得模塊之間的依賴關系變得明顯
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19185.html
