minglight

定義 :

在一個巢狀function的內部, child function使用到outter function的local var時, 會把local var綁著.
這時候如果inner function變成回傳值傳出去, 或者是被當作參數丟進去某個function中, 都會綁著這個Local var.

前情提要 : 

1. local var
    在一個function內, 用var xxx宣告的變數, 稱為local variable. 他的生命週期就在這個function的"{" 到 "}", 如果出了function還呼叫這個變數, 就會出現var不存在的錯誤訊息

    Note : 什麼不是local var => 
               a.  在最外層用var ooo宣告的變數, 其實他是window的成員變數
               b.  在function內部用this.xxx宣告的變數, 他是這個function被new起來之後的成員變數

2. 什麼是巢狀function
    function outter(){
　     function inner(){

        }
　}
    
用法與時機 : 

      如果你要使用一個API, 但是這個API紙可以傳function, 卻沒有辦法傳參數進去的時候, 就可以用Closure的方式把變數傳進來

ex1 : 跑Clock, 把傳進來的i綁起來.

1.1 標準的巢狀function

function outter(i){
   function inner(){
       document.getElementById('clock').html = i;
       i = i *2;
   }
   setInterval(inner, 1000);

}
outter(1);

or 

1.2 inner是anonymous function

function outter(i){
   
   setInterval(function(){
       document.getElementById('clock').html = i;
       i = i *2; 
   }, 1000);

}
outter(1);

or

1.3 比較常見的closure寫法, inner被當成function傳出去

function outter(i){
   return function(){
       document.getElementById('clock').html = i;
       i = i *2;
   }
   
}

setInterval(outter(1), 1000);

 ex2 : jquery的queue() and dequeue()
 
 參考這篇 http://minglight.pixnet.net/blog/post/37899609 先研究一下queue()的用法

 基本上就是使用queue的setter, 而運用上跟setInterval()是一樣的, 差別在於queue()你可能會放一些不同參數的function進來, 而這就是Closure美妙的地方, 你可以儘管綁架你想要的各式各樣的local var, 但是對queue()來說, 傳進來的只是個無參數的function, 他要做的只是執行他而已.