【前端开发】关于闭包最通俗易懂的解释 for循环，定时器，闭包混合一块的那点事。...

for循环，定时器，闭包混合一块的那点事。
    1，对于一个基本的for循环，顺序输出变量值。

        for(var i = 1; i < 4; i++){             console.log(i);//结果不多说了吧         }

    2，如果for循环中有定时器，如下代码。

        for (var i = 1; i < 4; i++) {
             setTimeout(function() {                
         console.log(i);//3个4             
        }, 3000);         
    }
        初衷想要3s后输出1,2,3。但是3s后，输出3个4。原因是定时器的异步执行，for循环的执行速度很快，当真正执行到函数体时，此时i早已变成4，所以结果不想而知。

    3，如果要得到正确结果，就要引入闭包来保存变量i不被销毁。

        for (var i = 1; i < 4; i++) { 
         (function(a) {  
            setTimeout(function() { 
              console.log(a);//操纵变量a，和i无关   
              }, 3000);  
        })(i)       
     }
        这样引入闭包，变量i保存下来，3s后函数体执行，输出1,2,3.

        也可以这样写

         for (var i = 1; i < 4; i++) { 
             setTimeout(fn(i), 3000);        
      }          
    function fn(a){  
        return function(){   
         console.log(a);   
         } 
    }
    4，如果要实现，没隔3s输出一个数字，即，3s输出1,3s后再输出2...，就要对定时器时间设置

        for (var i = 1; i < 4; i++) { 
        (function(a) { 
             setTimeout(function() {  console.log(a); 
             }, a*3000);
          })(i)  
     }
       实际上，for循环很快，上述代码类似于同时启动3个定时器，只需要确保时间不一样即可。在此，时间分别是3s，6s，9s，由于同时启动，但是执行时间不同，各个时间间隔都是3s。巧妙地达到了目的。

 

转载于:https://www.cnblogs.com/xiaohuizhang/p/9140783.html