在JavaScript中一個最廣泛使用的設(shè)計模式是模塊的模式。模塊模式使用了JavaScript中的一個很棒的特性-閉包- 用來給你方法中的隱私一些控制這樣的第三方應(yīng)用程序不能訪問私有數(shù)據(jù)或覆蓋它。在這篇文章中，我會教你什么是閉包，它是如何工作的，以及如何利用它在你的JavaScript代碼中實現(xiàn)模塊模式。什么是閉包？
閉包是JavaScript語言的一種構(gòu)造。在JavaScript內(nèi)所有變量都能在全局范圍內(nèi)訪問，除非變量在函數(shù)內(nèi)用var關(guān)鍵字聲明過。
variable1 = 1; //全局范圍
var variable2 = 2; // 不在一個函數(shù)內(nèi): 全局范圍
function funcName() {
variable3 = 3; // 沒用var關(guān)鍵字聲明: 全局范圍
var variable4 = 4; //僅本地訪問
}
在一個函數(shù)內(nèi)，你也可以獲得全局范圍和每個你所在的函數(shù)上級范圍的訪問權(quán)限。換句話說，函數(shù)內(nèi)聲明變量只能在函數(shù)包圍范圍內(nèi)訪問。
var globalvar = 1; //全局范圍
function outer() {
var outervar = 2; // outer()范圍內(nèi)
function inner() {
var innervar = 3; // inner()范圍內(nèi)
console.log(globalvar); // => 1
console.log(outervar); // => 2
console.log(innervar); // => 3
}
console.log(globalvar); // => 1
console.log(outervar); // => 2
console.log(innervar); // => Reference Error引用錯誤;
}
console.log(globalvar); // => 1
console.log(outervar); // => Reference Error引用錯誤
console.log(innervar); // => Reference Error引用錯誤
每一個真正的JavaScript程序員應(yīng)該知道這一點，除非他不思進(jìn)取。知道這一點，你可以得出這樣的結(jié)論，用一種辦法來保持你所有代碼在全局命名空間外，是正確的。這特別有用，當(dāng)你不想給任何人在未經(jīng)許可的情況下有重寫你任何代碼的機(jī)會。你可以通過使用一個匿名函數(shù)（不給它命名，沒有被賦予一個變量）立即執(zhí)行自身。這是眾所周知的自調(diào)用匿名函數(shù)（SIAF），雖然它可能是更準(zhǔn)確地稱為立即調(diào)用的函數(shù)表達(dá) (IIFE–讀做“iffy”) -作者BenAlman。
(function() {
// 這函數(shù)立即執(zhí)行，內(nèi)部所有變量都是私有的
}());
緊接著右大括號，是左右括號于是函數(shù)將立即執(zhí)行。圍繞整個函數(shù)表達(dá)式的括號不是運行的代碼必需的，但一般用作給其他開發(fā)人員的信號，這是一個IIFE，而不是一個標(biāo)準(zhǔn)函數(shù)。有些人喜歡在前面加上一個驚嘆號（!）或分號（;)，而不是用括號包起來。
用閉包的模塊模式###
知道了閉包是什么，我們就可以使用模塊模式創(chuàng)建對象。通過返回一個對象或變量并賦給一個函數(shù)外變量，這樣我們可以暴露任何希望暴露給外界的，我們可以有公開和私有的方法。
var Module = (function() {
// 下面函數(shù)是私有的，但可以被公開函數(shù)訪問
function privateFunc() { … };
// 返回一個對象賦予Module
return {
publicFunc: function() {
privateFunc(); // publicFunc可以直接訪問privateFunc
}
};
}());
這就是模塊模式的本質(zhì)。您還可以使用參數(shù)傳入或縮寫常用資源的名稱：
var Module = (function($, w, undefined) {
// …
// return {…};
}(jQuery, window));
我傳入jQuery和window，被分別縮寫為$和w。注意我沒有傳任何東西作為第三個參數(shù)。這樣參數(shù)undefined將是undefined，所以它完美地工作。有些人這樣處理undefined是因為無論如何，它是可編輯的。所以，如果你判斷某某是否是undefined，但undefined可能已經(jīng)改變，你的比較將不起作用。這種技術(shù)保證它將按預(yù)期工作。()
透露模塊模式revealing module pattern###
透露模塊模式是另一種方式來寫模塊模式，需要更多點代碼，但有時更容易理解和閱讀。不同于在IIFE中定義所有私有變量并在返回對象中定義公開方法，你把所有方法都寫在IIFE中，只是“透露”哪些是你想公開在return語句內(nèi)的。
var Module = (function() {
// 現(xiàn)在所有函數(shù)直接互訪
var privateFunc = function() {
publicFunc1();
};
var publicFunc1 = function() {
publicFunc2();
};
var publicFunc2 = function() {
privateFunc();
};
// 返回對象賦予Module
return {
publicFunc1: publicFunc1,
publicFunc2: publicFunc2
};
}());
對比正常的模塊模式，透露模塊模式有幾個優(yōu)點：所有函數(shù)的聲明和實現(xiàn)都在同一個地方，從而制造較少的混亂。
私有函數(shù)現(xiàn)在可以訪問公開函數(shù)，如果他們需要。
當(dāng)一個公開函數(shù)需要調(diào)用另一個公開函數(shù)時，他們調(diào)用publicFunc2()，而不是用this.publicFunc2()，從而節(jié)省了幾個字符。
透露模塊模式的唯一真正的缺點，正如我所說，是你必須寫更多的代碼，因為你必須先寫好函數(shù)然后再把它的名字寫在return語句內(nèi)，盡管它最終可能會因為你可以忽略this.部分而節(jié)省你的代碼。
擴(kuò)展模塊模式###
我想談的最后一件事是使用模塊模式擴(kuò)展已經(jīng)存在的模塊。這很常用，當(dāng)為jQuery之類的庫做插件，如下。
var jQuery = (function($) {
$.pluginFunc = function() {
…
}
return $;
}(jQuery));
此代碼是相當(dāng)靈活的，因為你甚至不需要var jQuery=或接近尾部的return語句。沒有它們jQuery仍將可以用這個新方法擴(kuò)展。實際上返回和賦值整個jQuery對象，可能在性能上有損失，但是，如果你想在擴(kuò)展jQuery的同時，分配jQuery到一個新的變量名，你只需改變第一行的jQuery為任何你想要的。
