DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 理解javascript函數式編程中的閉包(closure)
理解javascript函數式編程中的閉包(closure)
編輯:關於JavaScript     

閉包(closure)是函數式編程中的概念,出現於 20 世紀 60 年代,最早實現閉包的語言是 Scheme,它是 LISP 的一種方言。之後閉包特性被其他語言廣泛吸納。
閉包的嚴格定義是“由函數(環境)及其封閉的自由變量組成的集合體。”這個定義對於大家來說有些晦澀難懂,所以讓我們先通過例子和不那麼嚴格的解釋來說明什麼是閉包,然後再舉例說明一些閉包的經典用途。

什麼是閉包

通俗地講, JavaScript 中每個的函數都是一個閉包,但通常意義上嵌套的函數更能夠體
現出閉包的特性,請看下面這個例子:

var generateClosure = function() {
var count = 0;
var get = function() {
count ++;
return count;
};
return get;
};
var counter = generateClosure();
console.log(counter()); // 輸出 1
console.log(counter()); // 輸出 2
console.log(counter()); // 輸出 3

這段代碼中, generateClosure() 函數中有一個局部變量count, 初值為 0。還有一個叫做 get 的函數, get 將其父作用域,也就是 generateClosure() 函數中的 count 變量增加 1,並返回 count 的值。 generateClosure() 的返回值是 get 函數。在外部我們通過 counter 變量調用了 generateClosure() 函數並獲取了它的返回值,也就是 get 函數,接下來反復調用幾次 counter(),我們發現每次返回的值都遞增了 1。
讓我們看看上面的例子有什麼特點,按照通常命令式編程思維的理解, count 是generateClosure 函數內部的變量,它的生命周期就是 generateClosure 被調用的時期,當 generateClosure 從調用棧中返回時, count 變量申請的空間也就被釋放。問題是,在 generateClosure() 調用結束後, counter() 卻引用了“已經釋放了的” count變量,而且非但沒有出錯,反而每次調用 counter() 時還修改並返回了 count。這是怎麼回事呢?
這正是所謂閉包的特性。當一個函數返回它內部定義的一個函數時,就產生了一個閉包,閉 包 不 但 包 括 被 返 回 的 函 數 , 還包括這個函數的定義環境。上面例子中,當函數generateClosure() 的內部函數 get 被一個外部變量 counter 引用時, counter 和generateClosure() 的局部變量就是一個閉包。如果還不夠清晰,下面這個例子可以幫助
你理解:

var generateClosure = function() {
var count = 0;
var get = function() {
count ++;
return count;
};
return get;
};
var counter1 = generateClosure();
var counter2 = generateClosure();
console.log(counter1()); // 輸出 1
console.log(counter2()); // 輸出 1
console.log(counter1()); // 輸出 2
console.log(counter1()); // 輸出 3
console.log(counter2()); // 輸出 2

上面這個例子解釋了閉包是如何產生的:counter1 和 counter2 分別調用了 generateClosure() 函數,生成了兩個閉包的實例,它們內部引用的 count 變量分別屬於各自的運行環境。我們可以理解為,在generateClosure() 返回 get 函數時,私下將 get 可能引用到的 generateClosure() 函數的內部變量(也就是 count 變量)也返回了,並在內存中生成了一個副本,之後 generateClosure() 返回的函數的兩個實例 counter1和 counter2 就是相互獨立的了。

閉包的用途

1、嵌套的回調函數
閉包有兩個主要用途,一是實現嵌套的回調函數,二是隱藏對象的細節。讓我們先看下面這段代碼示例,了解嵌套的回調函數。如下代碼是在 Node.js 中使用 MongoDB 實現一個簡單的增加用戶的功能:

exports.add_user = function(user_info, callback) {
var uid = parseInt(user_info['uid']);
mongodb.open(function(err, db) {
if (err) {callback(err); return;}
db.collection('users', function(err, collection) {
if (err) {callback(err); return;}
collection.ensureIndex("uid", function(err) {
if (err) {callback(err); return;}
collection.ensureIndex("username", function(err) {
if (err) {callback(err); return;}
collection.findOne({uid: uid}, function(err) {
if (err) {callback(err); return;}
if (doc) {
callback('occupied');
} else {
var user = {
uid: uid,
user: user_info,
};
collection.insert(user, function(err) {
callback(err);
});
}
});
});
});
});
});
};

如果你對 Node.js 或 MongoDB 不熟悉,沒關系,不需要去理解細節,只要看清楚大概的邏輯即可。這段代碼中用到了閉包的層層嵌套,每一層的嵌套都是一個回調函數。回調函數不會立即執行,而是等待相應請求處理完後由請求的函數回調。我們可以看到,在嵌套的每一層中都有對 callback 的引用,而且最裡層還用到了外層定義的 uid 變量。由於閉包機制的存在,即使外層函數已經執行完畢,其作用域內申請的變量也不會釋放,因為裡層的函數還有可能引用到這些變量,這樣就完美地實現了嵌套的異步回調。

2、實現私有成員
我們知道, JavaScript 的對象沒有私有屬性,也就是說對象的每一個屬性都是曝露給外部的。這樣可能會有安全隱患,譬如對象的使用者直接修改了某個屬性,導致對象內部數據的一致性受到破壞等。 JavaScript通過約定在所有私有屬性前加上下劃線(例如_myPrivateProp),表示這個屬性是私有的,外部對象不應該直接讀寫它。但這只是個非正式的約定,假設對象的使用者不這麼做,有沒有更嚴格的機制呢?答案是有的,通過閉包可以實現。讓我們再看看前面那個例子:

var generateClosure = function() {
var count = 0;
var get = function() {
count ++;
return count;
};
return get;
};
var counter = generateClosure();
console.log(counter()); // 輸出 1
console.log(counter()); // 輸出 2
console.log(counter()); // 輸出 3

我們可以看到,只有調用 counter() 才能訪問到閉包內的 count 變量,並按照規則對其增加1,除此之外決無可能用其他方式找到 count 變量。受到這個簡單例子的啟發,我們可以把一個對象用閉包封裝起來,只返回一個“訪問器”的對象,即可實現對細節隱藏。

以上就是本文的全部內容,希望能夠幫助大家更好的學習理解javascript閉包。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved