您的位置:首页 > Web前端 > JavaScript

今天开始学习JavaScript---JavaScript闭包

2009-11-25 22:01 393 查看
 自从毕业就很少来写过什么啦。工作后慢慢变得安于现状,学得越来越少。真的常见得工作有些力不从心啦。现在还是得多钻些业务知识。不然真的很快就要被软件开发淘汰啦。。

 

今天开始好好研究学下JavaScript。虽然一直在用。可并没系统学过。总是觉得用着不顺手。驾驭起来真是很生疏。还是兴趣是原动力。。坚持!!坚持!!

 

 

另一种闭包定义来自www.w3school.com.cn:

  

JavaScript 最易让人误解的一点是,它支持闭包(closure)。

闭包,指的是词法表示包括不被计算的变量的函数,也就是说,函数可以使用函数之外定义的变量。

 

以下文章转自:http://blog.csdn.net/cheng5128/archive/2009/07/24/4613817.aspx

闭包的定义非常晦涩——闭包,是指语法域位于某个特定的区域,具有持续参照(读写)位于该区域内自身范围之外的执行域上的非持久型变量值能力的段落。这些外部执行域的非持久型变量神奇地保留它们在闭包最初定义(或创建)时的值(深连结)。简单来说,闭包就是在另一个作用域中保存了一份它从上一级函数或作用域取得的变量(键值对),而这些键值对是不会随上一级函数的执行完成而销毁。周爱民说得更清楚,闭包就是“属性表”,闭包就是一个数据块,闭包就是一个存放着“Name=Value”的对照表。就这么简单。但是,必须强调,闭包是运行期概念,一个函数实例。

javascrip闭包的实现,通常是在函数内部再定义函数,让该内部函数使用上一级函数的变量或全局变量。

ECMAScript认为使用全局变量是一个简单的闭包实例。

var sMessage = "Hello World";
function sayHelloWorld(){
   alert(sMessage);
};
sayHelloWorld();
但它完成没有体现闭包的特性……

现在比较让人认同的闭包实现有如下三种

with(obj){
    //这里是对象闭包
    }
(function(){
    //函数闭包
    })()
try{
//...
} catch(e) {
//catch闭包 但IE里不行
}
几个有用的示例
//*************闭包uniqueID*************
uniqueID = (function(){ //这个函数的调用对象保存值
 var id = 0; //这是私有恒久的那个值
 //外层函数返回一个有权访问恒久值的嵌套的函数
 //那就是我们保存在变量uniqueID里的嵌套函数.
 return function(){return id++;};  //返回,自加.
})(); //在定义后调用外层函数.
document.writeln(uniqueID()); //0
document.writeln(uniqueID()); //1
document.writeln(uniqueID()); //2
document.writeln(uniqueID()); //3
document.writeln(uniqueID()); //4
//*************闭包阶乘*************
var a = (function(n){
 if(n<1){ alert("invalid arguments"); return 0; }
 if(n==1){ return 1; }
 else{ return n * arguments.callee(n-1); }
})(4);
document.writeln(a);
function User( properties ) {   
    //这里一定要声明一个变量来指向当前的instance   
    var objthis = this;   
    for ( var i in properties ) {   
        (function(){   
                //在闭包内,t每次都是新的,而 properties[i] 的值是for里面的   
                var t = properties[i];   
                objthis[ "get" + i ] = function() {return t;};   
                objthis[ "set" + i ] = function(val) {t = val;};   
        })();    
    }   
}   
   
//测试代码   
var user = new User({   
    name: "Bob",   
    age: 44   
});   
   
alert( user.getname());   
alert( user.getage());   
   
user.setname("Mike");   
alert( user.getname());   
alert( user.getage());   
   
user.setage( 22 );   
alert( user.getname());   
alert( user.getage());  
附上今天在无忧看到的问题:

要求:

让这三个节点的Onclick事件都能正确的弹出相应的参数。

<ul>
   <li id="a1">aa</li>
   <li id="a2">aa</li>
   <li id="a3">aa</li>
</ul>

<script type="text/javascript">

for(var i=1; i < 4; i++){
   var id = document.getElementById("a" + i);
   id.onclick = function(){
     alert(i);//现在都是返回4
   }
}
</script>
我的解释是,当这三个绑定函数(onclick)建立后,外部var变量已经是4了,当我们调用它们,由于在它们的作用域内是没有i这个变量,迫使JS往外围作用域找,于是一找就找到它了,而它的值正如刚才所讲为4。

客服果果的解答:

for(var i=1; i < 4; i++){
    var id = document.getElementById("a" + i);
    /*
   这里生成了一个匿名函数并赋值给对象 id_i;
   */
    id.onclick = function(){
        /*
        这个i来源于局部变量,无法以window.i或者obj.i的形式在后期引用,
        只好以指针或者变量地址方式保存在这个匿名函数中,
        这就是传说的闭包,所以所有这个过程中生成的事件句柄都使用引用
        的方式来持久这个变量,也就是这些匿名函数共用一个变量i;
        */
        alert(i);
    };
};
局部变全局
for(var i=1; i < 4; i++){
    var id = document.getElementById("a" + i);
    id.i=i;//这个i有了根
    id.onclick=function(){
        alert(this.i)
    };
};
for(var i=1; i < 4; i++){
    var id = document.getElementById("a" + i);
    window[id.id]=i;//这个i有了根
    id.onclick=function(){
        alert(window[this.id]);
    };
}
产生一对一的更多闭包
for(var i=1; i < 4; i++){
    var id = document.getElementById("a" + i);
    id.onclick=(function(i){
        return function(){
            alert(i);//这个i是实参的闭包
        }
    })(i);
};
for(var i=1; i < 4; i++){
    var id = document.getElementById("a" + i);
    id.onclick = new function(){
        var i2=i;//这个i是闭包的闭包
        return function(){
            alert(i2);
        }
    };
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息