闭包

来源：互联网发布：淘宝客单品怎么推广? 编辑：程序博客网时间：2024/05/17 22:30

闭包作用(用法 : return 函数嵌套函数目的是为了让外界可以访问到函数内部的值)

设置了私有属性和方法,解决了命名重复的问题,避免了全局的污染.
延长了变量的声明周期(垃圾回收机制).

缺点:

常驻内存.
内存泄露.

  // 要a每次+1  怎么样可以即是私有变量又可以累加?                                            //闭包--拥有私有变量,又可以累加                                        // function fn(){    // var a = 1;                               var a = 1;    // function fn(){                           function ff(){    //     a++;          ===========>               a++;    //     alert(a);                                alert(a);    // }                                        }    // fn();//2                                 return ff; //    // fn();//3                             };    //                                      var a = fn();    //                                      a();    //                                      a();     // var a = "quanju";    // var fn = function(){    //     var b = "jubu";    //     alert(b);    //     function ff(){    //         var c = "neibu";    //         alert(c);    //     };    //     //neibu 让外界可以访问的到    //     return ff;    // }    // var d = fn();    // d();    /*        即是函数  -----  立即执行的函数        (function(){        })()        (function(){        }())     */    // var a = (function(){    //     function b(){    //         return 100;    //     }    //     return b;    // })();    // alert(a());    var a = (function(a){        function b(){            return a;        }        return b;    })(1);    //alert(a);    alert(a());

例子======>读取li的索引号

<!DOCTYPE html><html lang="en">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <meta name="Author" content="">        <meta name="Keywords" content="">        <meta name="Description" content="">        <title>闭包的运用</title>        <style type="text/css">            * { margin: 0; padding: 0;}            a {text-decoration: none;}            ul,li { list-style: none;}            body { font-family: "Microsoft yahei"; padding: 100px;}        </style>    </head><body>    <ul id="list">        <li>01</li>        <li>02</li>        <li>03</li>        <li>04</li>        <li>05</li>        <li>06</li>    </ul><script type="text/javascript">    //找到索引.    var liDoms = document.getElementById("list").getElementsByTagName('li');    var len = liDoms.length;    //自定义属性    function index(){        for(var i=0;i<len;i++){            liDoms[i].index = i;            liDoms[i].onclick = function(){                alert(this.index);            }        }    };    //index();    //自定义标签属性    function index2(){        for(var i=0;i<len;i++){            liDoms[i].setAttribute('index',i);            liDoms[i].onclick = function(){                alert(this.getAttribute('index'));            }        }    };    // index2();    //即时函数定义变量    function index3(){        for(var i=0;i<len;i++){            (function(){                var temp = i;                liDoms[temp].onclick = function(){                    alert(temp);                }            })();        }    };    // index3();    //闭包传值    function index4(){        for(var i=0;i<len;i++){            (function(a){                liDoms[a].onclick = function(){                    alert(a);                }            })(i);        }    }    index4();</script></body></html>

刨开详解

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="Author" content=" ">    <title>Document</title>    <style type="text/css">        *{margin: 0;padding: 0;}        a{text-decoration: none;}        ul,li{list-style: none;}        body{font-size: 14px;font-family: "微软雅黑";padding: 100px;}    </style></head><body>    <ul id="list">        <li>01</li>        <li>02</li>        <li>03</li>        <li>04</li>    </ul>    <script type="text/javascript">        /*            闭包                其实函数嵌套函数                每个函数都是一个独立的作用域                每个都有自己的生命周期                延长局部变量的声明周期         */        var liDoms = document.getElementById("list").getElementsByTagName("li");        for(var i=0;i<liDoms.length;i++){            (function(a){                liDoms[a].onclick = function(){                    alert(a);                }            })(i)        }        //函数也是一种数据类型 它和 number string boolean object 特殊在可以打括号去执行它 ====>不加括号时 他相当于number        //函数中的循环        //解决===> 1.即时函数(推荐).2.全局函数        function test(){            var arr = [],i;            for(i=0;i<3;i++){                arr[i] = (function fn(a){                    return a;                })(i);                //arr[i] = fn(i);            }            return arr;        }        // function fn(a){        //     return a;        // }        var c = test();        //alert(c);        for(var i=0;i<c.length;i++){            var value = c[i];            alert(value);        }    </script></body></html>

0 0