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);
	}
})

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

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

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

原文地址:https://www.cnblogs.com/Dewumu/p/14412507.html