浅谈闭包及其相关知识

时间:2022-04-13 22:39:52

要理解闭包,首先要理解javascript的特殊的变量作用域。

变量的作用域无非就两种:全局变量和局部变量。

javascript语言的特别之处就在于:函数内部可以直接读取全局变量,但是在函数外部无法读取函数内部的局部变量。

注意点:在函数内部声明变量的时候,一定要使用var命令。如果不用的话,你实际上声明的是一个全局变量!

function fn(){
    a = 'a';
    var b = 'b';
}
alert(a);
alert(b);//报错

 

接下来我们来了解一下什么是闭包,闭包就是为了解决作用域的问题是其能访问一个函数其作用域内的变量,闭包本质上就是一个函数

function out(){
  var a = 100;
  var inner = function(){
      alert(a)
  }
  return inner      
}
//新建变量接受inner函数
var fn = out();
//函数调用加括号
fn();

在上面的代码中,函数inner就被包括在函数out内部,这时out内部的所有局部变量,对inner都是可见的。但是反过来就不行,inner内部的局部变量,对out就是不可见的。

这就是Javascript语言特有的"链式作用域"结构(chain scope),

子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。

既然inner可以读取out中的局部变量,那么只要把inner作为返回值,我们不就可以在out外部读取它的内部变量了吗!

所以,在本质上,闭包是将函数内部和函数外部连接起来的桥梁。

 

看到这可能有人会把匿名函数和闭包搞混,最后再来介绍一下匿名函数,其实闭包就是作用域上的不同

普通函数:

//申明一个名为fn的函数
function fn(){
    alert(11)
}

匿名函数:

//匿名函数没有函数名,它复制给了变量a
var fn1 = function(){
    alert(22)
}

闭包可以用在许多地方。它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中,不会在out调用后被自动清除。

使用闭包的注意点

(1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。

(2)闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。

function outer() {
    var result = [];
    for(var i = 0; i<10; i++){
        result[i] = function () {
            console.log(i)
        }
    }
    return result
}
var array = outer();
for(var fn of array){
    fn();
}

看样子result每个闭包函数对打印对应数字,1,2,3,4,...,10, 实际不是,因为每个闭包函数访问变量i是outer执行环境下的变量i,随着循环的结束,i已经变成10了,所以执行每个闭包函数,结果打印10, 10, ..., 10