javascript 中闭包的例子

淡淡的烟草味﹌ 2022-12-13 12:56 219阅读 0赞

## 闭包含义: ##

一般函数;
    function outer() { 
      var localVal = 30;
      return localVal
    }
    
    outer() //30
    
    outer 函数里有一个局部变量 localVal, 值为 30. 然后 return 出去
    对于一般函数, 在调用结束后, 实际上局部变量可以释放了.
    具体释放要取决于垃圾回收机制
    这是一般函数的情况.
    
    但对于 javascript中的函数也是对象,
    并且函数也可以作为返回值, 也可以作为传参, 函数里也可以嵌套函数.
    实例如下:
    function outer() { 
      var localVal = 30;
      return function() { 
        return localVal
      }
    }
    
    var func = outer();
    func(); //30
    
    outer函数的返回值是一个匿名函数表达式,
    在匿名函数里又 return 了 outer 函数的局部变量 localVal,
    所以对于一般函数的情况,函数调用返回后局部变量可以被释放.
    
    但是这种嵌套的情况, localVal 不能被释放, 因为调用 outer 之后,
    返回的是匿名函数, 匿名函数里面仍然可以访问外部 outer 的局部变量,
    那么函数 outer 调用结束之后, 
    func 这个函数, 再次调用仍能访问到外函数的局部变量.
    这种情况就是闭包.

--------------------

## 闭包作用: ##

闭包的作用:
    处理事件点击
    处理异步请求
    封装变量
    等...
    
    比如:
    !function() { 
      var localData = "localData here";
      var url = "http://www.baidu.com/";
      $.ajax({ 
        url:url,
        success:function() { 
          //do sth.
          console.log(localData)
        }
      })
    }
    
    success 的回调函数里用到外层的变量,
    因为有闭包的缘故,
    最外面匿名函数结束调用之后,
    回调函数仍有能力访问到外层的 localData, url 等

封装:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ4NDQ2NTQy_size_16_color_FFFFFF_t_70_pic_center]

--------------------

## 闭包的小坑: ##

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ4NDQ2NTQy_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/1477c14524c94df2bcda70e506156461.png