zoukankan      html  css  js  c++  java
  • JavaScript闭包

    <!doctype html>
    <html lang='en'>
    <head>
        <title>闭包递归</title>
        <script>
        window.onload = function(){
            //闭包  能够读取其它函数内部变量的函数
            //JS 中每个函数都是个体,它是可以获取父元素的信息,但是父元素不能直接获取子元素内容
            //关键点:是否引用了外部变量
    
            //闭包
            function a() {
                var n = 0;
                function add(){
                    n++;
                    console.log(n);
                };
                add();
            };
            a();
    
            function a1() {
                this.n = 0;
                this.add = function(){
                    this.n++;
                    console.log(this.n);
                }
            };
            var a2 = new a1();
            a2.add()
            //另一种写法
            function a1() {
                var n = 0;
                this.add = function(){
                    n++;
                    console.log(n);
                }
            };
            var a2 = new a1();
            a2.add()
    
            function a3() {
                var n=0;
                function add(){
                    n++;
                    console.log(n);
                };
                return add;
            };
            a3(); //function
    
            function a3() {
                var n=0;
                function add(){
                    n++;
                    console.log(n);
                };
                return add;
            };
            a3()();
            //函数立即调用
            var a =(function (){
                var n=0;
                function add(){
                    n++;
                    console.log(n);
                };
                return add;
            }());
            a();
    
            //闭包传参数
            function f(x){
                var i = 0;
                return function(){
                    return x[i++]
                }
            }
            var abc = f(['a','b','c']);
            abc()
    
            var f = (function(x){
                var i = 0;  //1
                return function(){
                    return x[i++]
                }
            }(['a','b','c']))
            f();
    
    
            //递归   就是在运行的过程中调用自己
            function f(n) {
                if(n<=1){
                    return 1;
                }else {
                    return n*f(n-1)
                }
            };
            f(3)
        }
        </script>
    </head>
    <body>
        
    </body>
    </html>
    
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <title>软谋教育</title>
        <link rel="stylesheet" type="text/css" href="css/pure-min.css"> 
        <link rel="stylesheet" type="text/css" href="css/common.css">
        <link rel="stylesheet" href="font/iconfont.css">
        <script src="js/jquery-1.11.1.min.js"></script>
        <script src="font/iconfont.js"></script>
        <script src="js/demo1.js"></script>
    <body>
    <!--页面容器-->
    <div class="page-container">
      <!--开屏广告-->
        <div>
          <div id="count-down"><span class="jump">跳转<b>5</b></span></div> 
        </div>
        <!--主体-->
        <div class="content">
        <!-- LOGO -->
           <div class="header-login">
                <!-- <img src="img/logo.png"/> -->
                <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-RedBull"></use>
                </svg>
           </div>
           <!-- 按钮 -->
           <div class="content-main">
               <div class="btn-box btn-wechat">
                    <div class="pure-g">
                        <div class="pure-u-1-4  icon-i"><i class="iconfont">&#xe613;</i><label>教育培训</label></div>
                        <div class="pure-u-1-4 icon-i"><i class="iconfont">&#xe62e;</i><label>生活百科</label></div>
                        <div class="pure-u-1-4 icon-i"><i class="iconfont">&#xe61d;</i><label>家政服务</label></div>
                        <div class="pure-u-1-4 icon-i"><i class="iconfont">&#xe60f;</i><label>金融理财</label></div>
                    </div>
               </div>
                <p class="clause">
                    <label for="option-one" class="pure-checkbox">
                        本次上网时长<span id="ptime">00:00:00</span>
                    </label>
                </p>
           </div>   
        </div>
    </div>
    </body>
    </html>
    
    $(function() {
    	var num = $("#count-down span b").text();
    	var timer;
    	countDown(num);
    	$(".jump").click(function() {
    		jump();
    	})
    	//判断倒计时
    	function countDown(n) {
    		if(n>0){
    			setTimeout(function(){
    				n--;
    				$("#count-down span b").text(n);
    				countDown(n);
    			},1000)
    		}else {
    			jump();
    		}
    	};
    
    	function jump() {
    		$("#count-down").fadeOut(800);
    		if(timer){
    			clearInterval(timer);
    		}
    		timer = setInterval(setClock,1000);
    		
    	}
    	//记录上网时长
    	var h=0,m=0,s=0,str="";
    	function setClock() {
    		str="";
    		if(++s == 60){
    			if(++m== 60){
    				h++;
    				m=0;
    			}
    			s=0;
    		}
    		/*if(s<10){
    			str+='0'+s;
    		}else {
    			str+=s;
    		};*/
    		str += h<10?'0'+h:h;
    		str += ":";
    		str += m<10?'0'+m:m;
    		str += ":";
    		str += s<10?'0'+s:s;
    		$("#ptime").text(str);
    	}
    })
    

    本博客所有文章仅用于学习、研究和交流目的,欢迎非商业性质转载。

    博主的文章没有高度、深度和广度,只是凑字数。由于博主的水平不高,不足和错误之处在所难免,希望大家能够批评指出。

    博主是利用读书、参考、引用、抄袭、复制和粘贴等多种方式打造成自己的文章,请原谅博主成为一个无耻的文档搬运工!

  • 相关阅读:
    Exploits Likely Leveraged by Russia’s APT28 in Highly-Targeted Attack
    WAF绕过的一些总结和思考
    PHP SAFE MODE BYPASS
    RAS算法原理
    如何绕过WAF
    360手机助手关于签名校验的分析
    cat 命令详解
    面向对象简介
    APK签名及简单反编译
    面向对象之基本概念 封装、单多继承
  • 原文地址:https://www.cnblogs.com/Dewumu/p/14412507.html
Copyright © 2011-2022 走看看