javascript闭包实例

来源:互联网 发布:淘宝投诉卖家电话号码 编辑:程序博客网 时间:2024/05/17 15:04
<html><head><script>var Test = {};Test.Counter = (function(){var counter = null; return { a: function(){counter++;}, b: function(){counter++;}, c: function(){counter++;},d:function(){counter--;},get:function(){return counter;}}})();Test.Counter.a();Test.Counter.b();Test.Counter.c();Test.Counter.d();alert(Test.Counter.get());</script></head><body></body></html>这里首先需要理解的是类似      
(function(){//function body;})();//自动执行的函数块 (function($){})(jQuery);//相信用过jquery的朋友都知道这种结构的含义,这种方式的写法有一个前提,在代码执行到此处时,之前必须声明jQuery变量,在函数块自动调用时jQuery变量将会被$引用,以函数参数的方式将jQuery变量传到函数体内部。类似这样的方式写的函数,都是在函数创建之后就立即执行函数内部。在理解了上面两种写法之后,相信你很快能明白,其实Test.Counter在定义之后其本身是一个对象的形式,因为函数块自动执行时,直接向外层函数返回一个对象 即return {};同时函数块内的变量counter的作用于被限制在Test.Counter内部,也就是对该函数内部的所有方法可见,就是通常所说的javascript中如何定义私有变量。因为Test.Counter本身是一个对象,同时函数块又为该对象作用域范围内创建了一个变量。所有每次调用Test.Counter.a();Test.Counter.b();。。。。。其实这些函数都是操作的同一个变量。因为函数块执行之后变量counter就一直被存放在内存当中,并且作用域也限制在Test.Counter,该变量仅对Test.Counter内部的方法可见。所以这个文件执行之后最后

调试结果是:2

本文如有表述不清楚的地方还请见谅