JavaScript中的闭包

什么是闭包

闭包是指有权访问另一个函数作用域中的变量的函数。
简单理解就是，一个作用域可以访问另外一个作用域。

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

包的主要作用：延申了变量的作用范围。

例如：

//闭包是指有权访问另一个函数作用域中的变量的函数。
//闭包：我们fun 这个函数作用域 访问了另一个函数 fn 里面的局部变量 num
function fn(){
    var num = 10;
    function fun(){
        console.log(num);
    }
    fun();
}
fn();

了解如何创建作用域链对理解闭包很重要。

如何理解和创建作用域链

当某个函数被调用时，会创建一个执行环境及相应的作用域链。然后，使用arguments和其他命名参数的值来初始化函数的活动对象。但在作用域链中，外部函数的活动对象始终处于第二位，外部函数的外部函数的作用对象处于第三位，…直到作为作用域重点的全局执行环境。

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

作用域链本质上是一个指向变量对象的指针列表，它只引用但不实际包含变量对象。

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

例如：

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

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

createComparisonFunction() 函数在执行完毕后，其活动对象也不会被销毁，因为匿名函数的作用域链仍然在引用这个活动对象。换句话说，当 createComparisonFunction()函数返回后，其执行环境的作用域链会被销毁，但它的活动对象仍然会留在内存中；直到匿名函数被销毁后，createComparisonFunction()的活动对象才会被销毁。

例如：
//创建函数

var compareNames = createComparisonFunction("name"); 
 
//调用函数 
var result = compareNames({ name: "Nicholas" }, { name: "Greg" }); 
 
//解除对匿名函数的引用（以便释放内存） 
compareNames = null; 

由于闭包会携带包含它的函数的作用域，因此会比其他函数占用更多的内存。过度使用闭包可能会导致内存占用过多。

闭包与变量

作用域链的这种配置机制引出了一个值得注意的副作用，即闭包只能取得包含函数中任何变量的后一个值。闭包所保存的是整个变量对象，而不是某个特殊的变量。

例如：

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

这个函数会返回一个函数数组。表面上看，似乎每个函数都应该返自己的索引值，即位置 0的函数返回 0，位置 1的函数返回 1，以此类推。但实际上，每个函数都返回 10。因为每个函数的作用域链中都保存着 createFunctions()函数的活动对象，所以它们引用的都是同一个变量 i。当 createFunctions()函数返回后，变量 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; 
}