一、什么是模塊化
類似書本,作家會把他的書分成章節和段落;程序猿也會把他的代碼分成模塊。
就像書籍的一章,模塊僅僅是一坨代碼。
二、為何要使用模塊
模塊化可以使你代碼低耦合,功能模塊直接不相互影響。好處如下
1.可維護性:每個模塊都是獨立的。良好設計的模塊會盡量與外部的代碼撇清關系,以便于獨立對其進行改進和維護。
2.命名空間:在JacaScript中,最高級別的函數外定義的變量都是全局變量。因為如此,當一些無關的代碼碰巧使用到同名變量到時候,我們就會遇到"命名空間"污染問題。
3.可復用性:工作中,我們 會經常復制自己之前寫過的代碼到新項目中。復制粘貼雖然方便,但是可以重復利用到模塊更佳。
三、如何引入模塊
模塊模式
模塊模式一般用來模擬類的概念,這樣我們就能把公有和私有方法還有變量存儲在一個對象中。這樣我們就能在公開調用API的同時,仍然在一個閉包范圍內封裝私有變量和方法。
例一:匿名閉包函數
通過這種構造,匿名函數有啦自己的作用域或者‘閉包’,這允許我們從全局(父局)命名空間隱藏變量
這種方法的好處是,你可以在函數內部使用局部變量,而不會意外覆蓋同名全局變量,但仍然能夠訪問到全局變量。如下圖所示:
注意:一定要用括號把匿名函數包起來,以關鍵詞function開頭的語句總是會被解析成函數聲明(js中不允許沒有命名的函數聲明),加上括號后,內部的代碼會被識別為函數表達式。這個也叫立即執行函數。
例二:全局引入
另一種比較受歡迎的方法是一些諸如jQuery的庫使用的全局引入。和剛才的匿名閉包函數很相似,只是傳入全局變量的方法不同
這個例子中 globalVariable是唯一的全局變量。這種方法的好處是可以預先聲明好全局變量,讓你的代碼更加清晰可讀。
例3:對象接口
如圖,這是種創建模塊的方法是使用獨立的對象接口:
例四:模塊模式 Revealing module pattern
這和之前的實現方法非常接近,除了它會確保,在所有的變量和方法暴露之前都會保持私有: