javascript之我对闭包的理解

1.在函数外部可访问函数内部的变量

例:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>闭包演示</title>
<script type="text/javascript">
uniqueID = (function(){ //这个函数的调用对象保存值
    var id = 0; //这是私有恒久的那个值
    //外层函数返回一个有权访问恒久值的嵌套的函数
    //那就是我们保存在变量uniqueID里的嵌套函数.
    return function(){return id++;};  //返回,自加.
})(); //在定义后调用外层函数.
</script>
</head>
<body>
<script>
alert(uniqueID)
document.writeln(uniqueID()); //0
alert(uniqueID)
document.writeln(uniqueID()); //1
     alert(uniqueID)
document.writeln(uniqueID()); //2
alert(uniqueID)
document.writeln(uniqueID()); //3
document.writeln(uniqueID()); //4
</script>
</body>
</html>

例子解析:本身uniqueId()这个函数在调用后id这个值就该应消亡,再次调用的时候再创建,但是运行出来的结果缺是递增的,因为函数有两个返回,第一个返回,返回了一个匿名函数,匿名函数又返回了一个值,这个值是闭包函数的一个内部变量,因为这个变量在匿名函数中进行了调用,所以他就不能消亡.所以一直递增

2.是变量值挂起来

例:

未使用闭包:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8" />

<title>闭包演示</title>

<style type="text/css">

    p {background:gold;}

</style>

<script type="text/javascript">

function init() {   

    var pAry = document.getElementsByTagName("p");   

    for( var i=0; i<pAry.length; i++ ) {   

         pAry[i].onclick = function() {   

        alert(i);   

    }

  }

}

</script>

</head>

<body onload="init();">

<p>产品 0</p>

<p>产品 1</p>

<p>产品 2</p>

<p>产品 3</p>

<p>产品 4</p>

</body>

</html>

输出:全是5

使用了闭包:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8" />

<title>闭包演示</title>

<style type="text/css">

    p {background:gold;}

</style>

<script type="text/javascript">

function init() {  

    var pAry = document.getElementsByTagName("p");   

    for( var i=0; i<pAry.length; i++ ) {   

         (function(arg){

          pAry[i].onclick = function() {   

          alert(arg);

       }})(i);      

  }

}

</script>

</head>

<body onload="init();">

<p>产品 0</p>

<p>产品 1</p>

<p>产品 2</p>

<p>产品 3</p>

<p>产品 4</p>

</body>

</html>

输出:点击那个元素,显示对应元素的值

原文地址:https://www.cnblogs.com/xlhblogs/p/2183807.html