正如此前提到過的，出于優(yōu)化的目的，當函數(shù)不使用自由變量的時候，實現(xiàn)層可能就不會保存上層作用域鏈。 然而，ECMAScript-262-3標準中并未對此作任何說明；因此，嚴格來說 —— 所有函數(shù)都會在創(chuàng)建的時候將上層作用域鏈保存在[[Scope]]中。

有些實現(xiàn)中，允許對閉包作用域直接進行訪問。比如Rhino，針對函數(shù)的[[Scope]]屬性，對應有一個非標準的 parent屬性，在第二章中作過介紹：

var global = this;
var x = 10;

var foo = (function () {

  var y = 20;

  return function () {
    alert(y);
  };

})();

foo(); // 20
alert(foo.__parent__.y); // 20

foo.__parent__.y = 30;
foo(); // 30

// 還可以操作作用域鏈
alert(foo.__parent__.__parent__ === global); // true
alert(foo.__parent__.__parent__.x); // 10

這里還要注意的是：在ECMAScript中，同一個上下文中創(chuàng)建的閉包是共用一個[[Scope]]屬性的。 也就是說，某個閉包對其中的變量做修改會影響到其他閉包對其變量的讀?。?/p>

var firstClosure;
var secondClosure;

function foo() {

  var x = 1;

  firstClosure = function () { return ++x; };
  secondClosure = function () { return --x; };

  x = 2; // 對AO["x"]產生了影響, 其值在兩個閉包的[[Scope]]中

  alert(firstClosure()); // 3, 通過 firstClosure.[[Scope]]
}

foo();

alert(firstClosure()); // 4
alert(secondClosure()); // 3

正因為這個特性，很多人都會犯一個非常常見的錯誤： 當在循環(huán)中創(chuàng)建了函數(shù)，然后將循環(huán)的索引值和每個函數(shù)綁定的時候，通常得到的結果不是預期的（預期是希望每個函數(shù)都能夠獲取各自對應的索引值）。

var data = [];

for (var k = 0; k < 3; k++) {
  data[k] = function () {
    alert(k);
  };
}

data[0](); // 3, 而不是 0
data[1](); // 3, 而不是 1
data[2](); // 3, 而不是 2

上述例子就證明了 —— 同一個上下文中創(chuàng)建的閉包是共用一個[[Scope]]屬性的。因此上層上下文中的變量“k”是可以很容易就被改變的。

如下所示：

activeContext.Scope = [
  ... // higher variable objects
  {data: [...], k: 3} // activation object
];

data[0].[[Scope]] === Scope;
data[1].[[Scope]] === Scope;
data[2].[[Scope]] === Scope;

這樣一來，在函數(shù)激活的時候，最終使用到的k就已經變成了3了。

如下所示，創(chuàng)建一個額外的閉包就可以解決這個問題了：

var data = [];

for (var k = 0; k < 3; k++) {
  data[k] = (function _helper(x) {
    return function () {
      alert(x);
    };
  })(k); // 將 "k" 值傳遞進去
}

// 現(xiàn)在就對了
data[0](); // 0
data[1](); // 1
data[2](); // 2

上述例子中，函數(shù)“_helper”創(chuàng)建出來之后，通過參數(shù)“k”激活。其返回值也是個函數(shù)，該函數(shù)保存在對應的數(shù)組元素中。 這種技術產生了如下效果： 在函數(shù)激活時，每次“_helper”都會創(chuàng)建一個新的變量對象，其中含有參數(shù)“x”，“x”的值就是傳遞進來的“k”的值。 這樣一來，返回的函數(shù)的[[Scope]]就成了如下所示：

data[0].[[Scope]] === [
  ... // 更上層的變量對象
  上層上下文的AO: {data: [...], k: 3},
  _helper上下文的AO: {x: 0}
];

data[1].[[Scope]] === [
  ... // 更上層的變量對象
  上層上下文的AO: {data: [...], k: 3},
  _helper上下文的AO: {x: 1}
];

data[2].[[Scope]] === [
  ... // 更上層的變量對象
  上層上下文的AO: {data: [...], k: 3},
  _helper上下文的AO: {x: 2}
];

我們看到，這個時候函數(shù)的[[Scope]]屬性就有了真正想要的值了，為了達到這樣的目的，我們不得不在[[Scope]]中創(chuàng)建額外的變量對象。 要注意的是，在返回的函數(shù)中，如果要獲取“k”的值，那么該值還是會是3。

順便提下，大量介紹JavaScript的文章都認為只有額外創(chuàng)建的函數(shù)才是閉包，這種說法是錯誤的。 實踐得出，這種方式是最有效的，然而，從理論角度來說，在ECMAScript中所有的函數(shù)都是閉包。

然而，上述提到的方法并不是唯一的方法。通過其他方式也可以獲得正確的“k”的值，如下所示：

var data = [];

for (var k = 0; k < 3; k++) {
  (data[k] = function () {
    alert(arguments.callee.x);
  }).x = k; // 將“k”存儲為函數(shù)的一個屬性
}

// 同樣也是可行的
data[0](); // 0
data[1](); // 1
data[2](); // 2

另外一個特性是從閉包中返回。在ECMAScript中，閉包中的返回語句會將控制流返回給調用上下文（調用者）。 而在其他語言中，比如，Ruby，有很多中形式的閉包，相應的處理閉包返回也都不同，下面幾種方式都是可能的：可能直接返回給調用者，或者在某些情況下——直接從上下文退出。

ECMAScript標準的退出行為如下：

function getElement() {

  [1, 2, 3].forEach(function (element) {

    if (element % 2 == 0) {
      // 返回給函數(shù)"forEach"，
      // 而不會從getElement函數(shù)返回
      alert("found: " + element); // found: 2
      return element;
    }

  });

  return null;
}

alert(getElement()); // null, 而不是 2

然而，在ECMAScript中通過try catch可以實現(xiàn)如下效果：

var $break = {};

function getElement() {

  try {

    [1, 2, 3].forEach(function (element) {

      if (element % 2 == 0) {
        // 直接從getElement"返回"
        alert("found: " + element); // found: 2
        $break.data = element;
        throw $break;
      }

    });

  } catch (e) {
    if (e == $break) {
      return $break.data;
    }
  }

  return null;
}

alert(getElement()); // 2

通常，程序員會錯誤的認為，只有匿名函數(shù)才是閉包。其實并非如此，正如我們所看到的 —— 正是因為作用域鏈，使得所有的函數(shù)都是閉包（與函數(shù)類型無關： 匿名函數(shù)，F(xiàn)E，NFE，F(xiàn)D都是閉包）， 這里只有一類函數(shù)除外，那就是通過Function構造器創(chuàng)建的函數(shù)，因為其[[Scope]]只包含全局對象。 為了更好的澄清該問題，我們對ECMAScript中的閉包作兩個定義（即兩種閉包）：

ECMAScript中，閉包指的是：

從理論角度：所有的函數(shù)。因為它們都在創(chuàng)建的時候就將上層上下文的數(shù)據保存起來了。哪怕是簡單的全局變量也是如此，因為函數(shù)中訪問全局變量就相當于是在訪問自由變量，這個時候使用最外層的作用域。

從實踐角度：以下函數(shù)才算是閉包：

即使創(chuàng)建它的上下文已經銷毀，它仍然存在（比如，內部函數(shù)從父函數(shù)中返回）

在代碼中引用了自由變量

實際使用的時候，閉包可以創(chuàng)建出非常優(yōu)雅的設計，允許對funarg上定義的多種計算方式進行定制。 如下就是數(shù)組排序的例子，它接受一個排序條件函數(shù)作為參數(shù)：

[1, 2, 3].sort(function (a, b) {
  ... // 排序條件
});

同樣的例子還有，數(shù)組的map方法（并非所有的實現(xiàn)都支持數(shù)組map方法，SpiderMonkey從1.6版本開始有支持），該方法根據函數(shù)中定義的條件將原數(shù)組映射到一個新的數(shù)組中：

[1, 2, 3].map(function (element) {
  return element * 2;
}); // [2, 4, 6]

使用函數(shù)式參數(shù)，可以很方便的實現(xiàn)一個搜索方法，并且可以支持無窮多的搜索條件：

someCollection.find(function (element) {
  return element.someProperty == "searchCondition";
});

還有應用函數(shù)，比如常見的forEach方法，將funarg應用到每個數(shù)組元素：

[1, 2, 3].forEach(function (element) {
  if (element % 2 != 0) {
    alert(element);
  }
}); // 1, 3

順便提下，函數(shù)對象的 apply 和 call方法，在函數(shù)式編程中也可以用作應用函數(shù)。 apply和call已經在討論“this”的時候介紹過了；這里，我們將它們看作是應用函數(shù) —— 應用到參數(shù)中的函數(shù)（在apply中是參數(shù)列表，在call中是獨立的參數(shù)）：

(function () {
  alert([].join.call(arguments, ";")); // 1;2;3
}).apply(this, [1, 2, 3]);

閉包還有另外一個非常重要的應用 —— 延遲調用：

var a = 10;
setTimeout(function () {
  alert(a); // 10, 一秒鐘后
}, 1000);

也可以用于回調函數(shù)：

...
var x = 10;
// only for example
xmlHttpRequestObject.onreadystatechange = function () {
  // 當數(shù)據就緒的時候，才會調用;
  // 這里，不論是在哪個上下文中創(chuàng)建，變量“x”的值已經存在了
  alert(x); // 10
};
..

還可以用于封裝作用域來隱藏輔助對象：

    var foo = {};

    // initialization
    (function (object) {

      var x = 10;

      object.getX = function _getX() {
        return x;
      };

    })(foo);

    alert(foo.getX()); // get closured "x" – 10

本文介紹了更多關于ECMAScript-262-3的理論知識，而我認為，這些基礎的理論有助于理解ECMAScript中閉包的概念。

JavaScript閉包（by Richard Cornford）

Funarg問題

閉包

英文原文
來自前端翻譯小站 趙靜、彭森材