本文例項講述了JavaScript閉包原理與用法。分享給大家供大家參考，具體如下：

為了更好的理解，在閱讀此文之前建議先閱讀上一篇《JavaScript詞法作用域與作用域鏈》

1.什麼是閉包

閉包的含義就是閉合，包起來，簡單的來說，就是一個具有封閉功能與包裹功能的結構。所謂的閉包就是一個具有封閉的對外不公開的，包裹結構，或空間。

在JS中函式構成閉包。一般函式是一個程式碼結構的封閉結構，即包裹的特性，同時根據作用域規則只允許函式訪問外部的資料，外部無法訪問函式內部的資料，即封閉的對外不公開的特性，因此說函式可以構成閉包。

概括：閉包就是一個具有封閉與包裹功能的結構。函式可以構成閉包。函式內部定義的資料函式外部無法訪問，即函式具有封閉性；函式可以封裝程式碼即具有包裹性，所以函式可以構成閉包。

2.閉包有什麼用（解決什麼問題）？

1. 閉包不允許外部訪問
2. 要解決的問題就是間接訪問該資料

函式就可以構成閉包，要解決的問題就是如何訪問到函式內部的資料

function foo () {
 var num = 123;
 return num;
}
var res = foo();
console.log( res ); // =>123

這裡的確是訪問到函式中的資料了。但是該資料不能第二次訪問，因此第二次訪問的時候又要呼叫一次foo，表示又有一個新的num = 123出來了。

在函式內的資料，不能直接在函式外部訪問，那麼在函式內如果定義一個函式，那麼在這個函式內部中是可以直接訪問的

function foo() {
 var num = Math.random();
 function func() {
  return mun;
 }
 return func;
}
var f = foo();
// f 可以直接訪問這個 num
var res1 = f();
var res2 = f();

我們使用前面學習的繪製作用域鏈結構圖的方法來繪製閉包的作用域鏈結構圖，如下：

3.閉包使用舉例

如何獲得超過一個數據

function foo () {
 var num1 = Math.random();
 var num2 = Math.random();
 return {
  num1: function () {
   return num1;
  },num2: function () {
   return num2;
  }
 }
}

如何完成讀取一個數據和修改這個資料

function foo () {
 var num = Math.random();
 return {
  get_num : function () {
   return num;
  },set_num: function( value ) {
   return num = value;
  }
 }
}

4.基本的閉包結構

一般閉包的問題就是要想辦法簡潔的獲取函式內的資料使用權，那麼我們就可以總結出一個基本的使用模型。

1. 寫一個函式，函式內部定義一個新函式，返回新函式，用新函式獲得函式內的資料
2. 寫一個函式，函式內部定義個一個物件，物件中繫結多個函式（方法），返回物件，利用物件的方法訪問函式內的資料

5.閉包的基本用法

閉包是為了實現具有私有訪問空間的函式的

帶有私有訪問資料的物件

function Person() {
 this.name = "張三";
 // setName( '' )
}

所有的私有資料，就是說只有函式內部可以訪問的資料，或物件內部的方法可以訪問的資料

最簡單的實現：

function createPerson() {
 var __name__ = "";
 return {
  getName: function () {
   return __name__;
  },setName: function( value ) {
   // 如果不姓張就報錯
   if ( value.charAt(0) === '張' ) {
    __name__ = value;
   } else {
    throw new Error( '姓氏不對，不能取名' );
   }
  }
 }
}
var p = createPerson();
p.set_Name( '張三丰' );
console.log( p.get_Name() );
p.set_Name( '張王富貴' );
console.log( p.get_Name() );

帶有私有資料的函式

var func = function () {}
function func () {}
var foo = (function () {
 // 私有資料
 return function () {
  // 可以使用私有的資料
  ...
 };
});

6.閉包基本模型

物件模型

function foo () {
 // 私有資料
 return {
   method : function(){
    // 操作私有資料
   }
 }
}

函式模型

function foo(){
 // 私有資料
 return function(){
   // 可以操作私有資料
 }
}

7.沙箱模式（閉包應用的一個典範）

7.1 沙箱的概念

沙盤與盒子，就可以在一個笑笑的空間內模擬顯示世界，特點是執行效果與現實世界一模一樣，但是在沙箱中模擬與現實無關.

7.2 沙箱模式

沙箱模式就是一個自呼叫函式，程式碼寫到函式中一樣會執行，但是不會與外界有任何的影響

例如，在jQuery中

(function () {
 var jQuery = function () { // 所有的演算法 }
 // .... // .... jQuery.each = function () {}
 window.jQuery = window.$ = jQuery;
})();
$.each( ... )

8.帶有快取功能的函式

以 Fibonacci 數列為例，改進傳統計算斐波那契數列方法
我們來回顧一下傳統遞迴方式求斐波那契數列方法，我們定義一個count變數來檢視遞迴了多少次：

var count = 0;
function fibo( n ){
 count++;
 if( n ==0 || n == 1 ) return 1;
 return fibo( n - 1 ) + fibo( n - 2 );
}
fib1( 20 );
console.log( count1 );
// 5: 15
// 6: 25
// ...
// 20: 21891

當 n = 5 式，count = 15，當時當 n = 20 的時候，count就達到驚人的21891次，效能太低了

效能低的原因是 重複計算。如果每次將計算的結果存起來

• 那麼每次需要的時候先看看有沒有儲存過該資料，如果有，直接拿來用。
• 如果沒有再遞迴，但是計算的結果需要再次儲存起來，以便下次使用

改進版：

var data = [ 1,1 ];
var count = 0;
function fibo( n ) {
 count++;
 var v = data[ n ];
 if( v === undefined ){
   v = fibo( n - 1 ) + fibo( n - 2 );
   data[ n ] = v;
 }
 return v;
}
fibo( 100 );
console.log( count ); // 199

改進之後， n = 100的時候也才199次，大大提高了效能。

9.閉包的效能問題

函式執行需要記憶體，那麼函式中定義的變數，會在函式執行結束後自動回收，凡是因為閉包結構的，被引出的資料，如果還有變數引用這些資料的話，那麼這些資料就不會被回收。

因此在使用閉包的時候如果不適用某學資料了，一定要賦值一個null

var f = (function () {
 var num = 123;
 return function () {
  return num;
 };
})();
// f 引用著函式，函式引用著變數num
// 因此在不適用該資料的時候，最好寫上
f = null;

感興趣的朋友可以使用線上HTML/CSS/JavaScript程式碼執行工具：http://tools.jb51.net/code/HtmlJsRun測試上述程式碼執行效果。

更多關於JavaScript相關內容可檢視本站專題：《JavaScript常用函式技巧彙總》、《javascript面向物件入門教程》、《JavaScript錯誤與除錯技巧總結》、《JavaScript資料結構與演算法技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程式設計有所幫助。