所謂的模塊化編程就是封裝細節(jié)，提供使用接口，彼此之間互不影響，每個模塊都是相互獨立，實現(xiàn)某一特定的功能。如果其他模塊想調(diào)用的時候，可以暴露我們所希望對外的公開的方法與數(shù)據(jù)。

1、函數(shù)寫法

function f1(){ var value=1； //... } function f2(){var value=2； //... }

這里定義了f1跟f2，每個函數(shù)相當(dāng)于一個模塊，f1跟f2是相互獨立的，不能訪問到對方里面的局部內(nèi)容value；這種寫法定義了全局變量f1、f2污染了全局環(huán)境會導(dǎo)致命名沖突（在上一篇文章提過）。

?

2、對象寫法

var myModule= new Object({value : 0,f1 : function (){//... 　　　　},f2 : function (){//... 　　　　} });

把函數(shù)f1()和f2(），封裝在myModule對象里。使用的時候，就是調(diào)用這個對象的屬性即可：myModule.f1()。這樣的寫法會暴露所有模塊成員，內(nèi)部狀態(tài)可以被外部改寫如：myModule.value=1 ，會改變myModule內(nèi)部的屬性值。同時這種辦法只能一定程度上減少了命名沖突的問題，不能完全避免命名沖突。

?

3、立即執(zhí)行函數(shù)寫法

（1）匿名閉包寫法　

(function () { // ... }());

javascript中沒用私有作用域的概念，根據(jù)javascript函數(shù)作用域鏈的特性，使用這種寫法可以模仿一個私有作用域。在閉包中，可以定義私有變量和函數(shù)，外部無法訪問它們，從而做到了私有成員的隱藏和隔離，俗稱“匿名包裹器”或“命名空間”。

（2）全局引入寫法

(function (a) { a.a3 = function () {//... 　　　};// … }(a));

將a對象作為參數(shù)傳入，在函數(shù)體內(nèi)對這個對象進行操作。這樣做除了保證模塊的獨立性，還使得模塊之間的依賴關(guān)系變得明顯。現(xiàn)在很多類庫里都有這種使用方式，比如jQuery源碼。

（3）模塊導(dǎo)出寫法

var myModule = (function(){
var value = 0;var f1 = function(){//... 　　　　};var f2 = function(){//... 　　　　};return {value: value,f2 : f2};})();

這里，我們聲明了一個全局的模塊叫myModule，它包含二個屬性，一個成員變量value和一個成員方法f1。除此之外，它還使用匿名函數(shù)的閉包維護了私有內(nèi)部狀態(tài)，我們也可以通過按需傳入外部變量。

（3）擴展模式寫法

var myModule = (function (a) { var value =a.value;var f1 = function(){//... 　　　　};var f2 = function(){//... 　　　　};return {value: value,f2 : f2};}(a));

這里，我們在閉包中定義私有變量和函數(shù)，外部無法訪問它們，做到了私有成員的隱藏和隔離。將某對象作為參數(shù)傳入，在函數(shù)體內(nèi)對該對象進行操作，然后返回對象或函數(shù)。由此，可以做到把依賴項通過參數(shù)的形式注入進來在內(nèi)部使用注入的屬性，并且可以暴露我們所希望對外的公開的方法與數(shù)據(jù)。這就是模塊化編程的基礎(chǔ)思想。

在此思想之下，javaScript模塊化編程開始盛行，大牛們開始進行各式各樣的封裝打包，從而產(chǎn)出一系列的模塊化規(guī)范、模塊化加載器。上面的方法中，a必須在模塊myModule之前定義，如果a依賴項自身是一個大的模塊，比如一個庫，我們?nèi)绾巫龅皆趍yModule之前定義加載a，然后在myModule中成功地引用a呢？模塊化加載器便能幫我們解決這個問題。

下一篇我們開始介紹模塊化規(guī)范的先驅(qū)-------CommonJS規(guī)范；

?

轉(zhuǎn)載于:https://www.cnblogs.com/huiguo/p/7967189.html

總結(jié)

以上是生活随笔為你收集整理的前端模块化（二）：模块化编程的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。