zoukankan      html  css  js  c++  java
  • 简单说下js闭包之setTimeout

    今天写代码的时候发现  网页上很多弹窗需要自动关闭

    倒计时5秒之后用户无操作就关闭了,(angular 框架),代码如下,一:

            for(var i=5;i>0;i--){
                setTimeout((function(i){        
                    return function(){
                        $scope.upstate="上传失败!"+(5-i)+"秒后本窗口关闭";    
                        //$scope.upclosed();    
                        //console.log($scope.upstate);
                        $scope.$apply();
                        //console.log(new Date().getTime());                    
                        if(i==5){                        
                            $scope.upclosed();            
                        }                    
                    }
                })(i),i*1000);
            }

    输出结果是:

    二: 稍加改动,去掉函数(),如下所示

       for(var i=5;i>0;i--){
                setTimeout(function(i){        
                    return function(){
                       // $scope.upstate="上传失败!"+(5-i)+"秒后本窗口关闭";  
                    window.upstate="上传失败!"+(5-i)+"秒后本窗口关闭";                    
                        //$scope.upclosed();    
                        console.log(window.upstate);
                        //$scope.$apply();
                        console.log(new Date().getTime());                    
                        if(i==5){                        
                           // $scope.upclosed();            
                        }                    
                    }
                }(i),i*1000);
            }

    依然能够正常使用

    三: function(i){}(i) 两个i都不能少 ,少了第一个  i的值会变成全是5,但是依然能够按5,4,3,2,1的时间顺序输出5

    少了第二个 i 的值会变成NAN

    四:换一种方法 将整个setTimeout 都封起来

            for(var i=5;i>0;i--){
            
            (function(i){
            
                setTimeout(function(){       
                   
                       // $scope.upstate="上传失败!"+(5-i)+"秒后本窗口关闭";  
                        window.upstate="上传失败!"+(5-i)+"秒后本窗口关闭";                    
                        //$scope.upclosed();    
                        console.log(window.upstate);
                        //$scope.$apply();
                        console.log(new Date().getTime());                    
                        if(i==5){                        
                           // $scope.upclosed();            
                        }                    
                    },i*1000);
            })(i)
        
        }

    也是 可以的 这个时候(function(){}())的最外层()不能去掉的

  • 相关阅读:
    web前端开发最佳实践--(笔记之JavaScript最佳实践)
    web前端开发最佳实践--(笔记一)
    HTML5及CSS3--freeCodeCamp(笔记一)
    javascript系列--函数(一)
    HTML5本地存储
    分享一些好用的设计网站
    .net面试问题总结
    ife_task10--弹性盒子
    WPF--搭建一个简单的demo
    信息技术文集
  • 原文地址:https://www.cnblogs.com/mengsx/p/6642619.html
Copyright © 2011-2022 走看看