JAVASCRIPT之闭包

闭包

闭包指的是有权访问另一个函数作用域中的变量的函数。

创建闭包的常见方式，就是在一个函数内部创建另一个函数。

function createComparisonFunction(propertyName) {
    return function(object1, object2) {
        var value1 = object1[propertyName];
        var value2 = object2[propertyName];
        
        if (value1 < value2) {
            return -1;
        } else if (value1 > value2) {
            return 1; 
        } else {
            return 0;
        }
    };
}

在这个例子中，突出的两行代码是内部函数中的代码， 这两行代码访问了外部函数中的变量propertyName。即使这个内部函数返回了，而且是在其他地方被调用了， 但它仍然可以访问变量propertyName。 之所以还能访问这个变量，是因为内部函数的作用域链中包含createComparisonFunction()的作用域。

当某个函数第一次被调用时，会创建一个执行环境及相应的作用域链， 并把作用域赋值给一个特殊的内部属性（即[[scope]]）。然后，使用this, arguments和其他命名参数的值来初始化函数的活动对象。但在作用域链中，外部函数的活动对象始终处于第二位，外部函数的外部函数的活动对象处于第三位， ...直至作用域链终点的全局执行环境。

在函数执行过程中，为读取和写入变量的值，就需要在作用域链中查找变量。

function compare(value1, value2) {
    if (value1 < value2) {
        return -1;
    } else if (value1 > value2) {
        return 1;
    } else {
        return 0;
    }
}
var result = compare(5, 10);
alert(result);

以上代码先定义了compare()函数，然后又在全局作用域中调用了它。 当第一次调用compare()时，会创建一个包含this, arguments, value1 和 value2 的活动对象。 全局执行环境的变量对象（包含 this, result 和 compare）在compare() 执行环境的作用域链中则处于第二位。以下是compare()函数执行时的作用域链。

后台的每个执行执行环境都有一个表示变量的对象--变量对象。全局环境的变量对象始终存在，而像compare()函数这样的局部环境的变量对象，则只在环境执行的过程中存在。在创建compare() 函数时，会先创建一个预先包含全局变量对象的作用域链，这个作用域链被保存在内部的[[scope]]属性中。当代用compare()函数时，会为函数创建一个执行环境，然后通过复制函数的[[scope]]属性中的对象构建起执行环境的作用域链。此后，又有一个活动对象（在此作为变量对象使用）被创建并推入执行环境作用域链的前端。对于这个例子中compare()函数的执行环境而言，其作用域链中包含两个变量对象：本地活动对象和全局变量对象。显然，作用域链本质上是一个指向变量对象的指针列表，它只引用但不实际包含变量对象。

无论什么时候在函数中访问一个对象时，就会从作用域链中搜索具有相应名字的变量。一般来讲，当函数执行完毕后，局部活动对象就会被销毁，内存中仅保存全局作用域（全局执行环境的变量对象）。但是，闭包的情况又有所不同。

在另一个函数内部定义的函数会将包含函数（即外部函数）的活动对象添加到它的作用域链中。因此，在createComparisonFuction() 函数内部定义的匿名函数的作用域链中，实际上将包含外部函数createComparisonFunction() 的活动对象。如下图：

var compare = createComparisonFunction("name");
var result = compare({"name":"Nicholas"}, {"name":"Greg"});

在匿名函数从createComparisonFunction()中被返回后，它的作用域链初始化为包含createComparisonFunction()函数的活动对象和全局变量对象。这样，匿名函数就可以访问createComparisonFunction()中定义的所有变量。更为重要的是，createComparisonFunction()函数在执行完毕后，其活动对象也不会被销毁，因为匿名函数的作用域链仍然在引用这个活动对象。换句话说，当createComparisonFunction() 函数返回后，其执行环境的作用域链会被销毁，但它的活动对象仍然会留在内存中； 知道匿名函数被销毁后，createComparisonFunction()的活动对象才会被销毁，例如：

var compareNames = createComparisonFunction("name");
var result = compareNames({"name":"Nicholas"}, {"name":"Greg"});
compareNames = null;

首先，创建的比较函数被保存在变量compareNames中。 而通过将compareNames设置为等于null，解除该函数的引用，就等于通知垃圾回收例程将其清楚。随着匿名函数的作用域链被销毁，其他作用域链（除了全局作用域）也可以安全地销毁了。

闭包与变量

作用域链的这种变量机制引出了一个值得注意的副作用，即闭包只能取得包含函数中任何变量的最后一个值。别忘了闭包索堡村的是整个变量对象，而不是某一个特殊的变量。下面这个例子可以清晰地说明这个问题。

function createFunctions() {
    var result = new Array();

    for (var i = 0; i < 10; i++) {
        result[i] = function() {
            return i;
        }
    }
    return result;
}

var result = createFunctions();
for (var i = 0; i < 10; i++) {
    console.log(result[i]());
}

这个函数会返回一个函数数组。表面上看，似乎每个函数都应该返回自己的索引值，即位置0的函数返回0，位置1的函数返回1，以此类推。但实际上，每个函数都返回10，因为每个函数的作用域链中都保存着createFunctions() 函数的活动对象，所以它们应用的都是同一个变量 i 。当createFunction()函数返回后，变量 i 的值是10，此时每个函数都引用着保存变量 i 的同一个变量对象， 所以在每个函数内部 i 的值都是10。 但时， 我们可以通过创建一个另一个匿名函数强制让闭包行为符合预期。如下所示：

function createFunctions() {
    var result = new Array();

    for (var i = 0; i < 10; i++) {
        result[i] = (function(num) {
            return function() {
                return num;
            };
        })(i);
    }
    return result;
}

在重写了前面的createFunctions() 函数后，每个函数就会返回各自不同的索引值了。这个版本中，我们没有直接把闭包赋值给函数，而是定义了一个匿名函数，并将立即执行该函数的结果赋值给数组。这里的匿名函数有一个参数num，也就是最终的函数要返回的值。在调用每个匿名函数时，我们传入变量 i 。 由于函数参数是按值传递的，所以就会将变量 i 的当前值复制给参数num。而在这个匿名函数内部，又创建并返回了一个访问num的闭包。这样一来，result数组的每个函数都有num变量的一个副本，因此就可以返回各自不同的数值了。

其实在上述返回的函数数组中， 由于每次都是通过调用一个匿名函数，所以返回的函数中的作用域链中都包含了这个匿名函数的活动对象，因为每次调用的时候num的值都不一样，所以每个匿名函数的活动对象中的参数num也是不一样的，所以才能够返回对应的索引值。

以返回的函数数组中的第一个函数（result[1]）为例， 该函数的作用域链如下：

  本地函数活动对象（自身的活动对象）  ->  匿名函数的活动对象 -> createFunctions()函数的活动对象 -> 全局环境的变量对象

其实在这个过程中，实际上是产生了10个匿名函数， 也就有10个匿名函数的对象。result[1] 对应的匿名函数的活动对象中的参数num的值为1， 以此类推， result[10]对应的匿名函数的活动对象中的参数的值为10。

关于this对象

在闭包中使用this对象也可能会导致一些问题。我们知道，this对象是在运行时基于函数的执行环境绑定的：在全局函数中，this等于window， 而当函数当作为某个对象的方法调用是，this等于那个对象。不过，匿名函数的执行环境具有全局性，因此其this对象通常指向window。 但有时候由于编写闭包的方式不同，这一点可能不会那么明显。看下面的例子。

var name = "The window";

var object = {
    name : "My Object",
    getNameFunc: function() {
        return function() {
            return this.name;
        };
    }
};

alert(object.getNameFunc()());  //The window

以上代码先创建了一个全局变量name, 又创建了一个包含name属性的对象。这个对象还包含一个方法--getNameFunc()，它返回一个匿名函数，而匿名函数又返回this.name。 由于getNameFunc() 返回一个函数，因此调用object.getNameFunc()就会立即调用它返回的函数，结果就是返回一个字符串。然而，这个例子返回的字符串中是"The window", 即全局name变量的值。

前面提到过，每个函数在被调用时，其活动对象都会自动取得两个特殊变量：this 和 arguments。 函数内部在搜索这两个变量时，只会搜索到其活动对象为止，因此永远不可能直接访问外部函数中的这两个变量。不过，把外部作用域中的this对象保存在一个闭包也能够访问的变量里， 就可以让闭包访问对象了。如下所示：

var name = "The window";

var object = {
    name : "My Object",
    getNameFunc: function() {
        var that = this;
        return function() {
            return that.name;
        };
    }
};

alert(object.getNameFunc()()); //My Object

代码中加粗的行显示了这个例子与前一个例子之间的不同之处。在定义匿名函数之前，我们把this对象赋值给了一个名叫that的变量。而在定义了闭包之后，闭包也可以访问这个变量，因为它是我们在函数中特意生命的一个变量。即使在函数返回之后，that也仍然引用这object, 所以调用object.getNameFunc() 就返回了 "My Object"。

备注： 摘取自《JAVASCRIPT高级程序设计：第3版》