日期:2014-05-16  浏览次数:20388 次

一个关于闭包的问题
<!doctype html>
<title>javascript闭包 by 司徒正美</title>
<meta charset="utf-8"/>
<meta name="keywords" content="javascript闭包 by 司徒正美" />
<meta name="description" content="javascript闭包 by 司徒正美" />
<script type="text/javascript">
  window.onload = function(){
     for(var i=1; i < 4; i++){
        var id = document.getElementById("a" + i);
           id.onclick = function(){
             alert(i);//现在都是返回4
           }
     }
  }
</script>
<h1>javascript闭包 by 司徒正美</h1>
<ul>
  <li id="a1">aa</li>
  <li id="a2">aa</li>
  <li id="a3">aa</li>
</ul>


求解释,为什么 三次输出的值都是4

------解决方案--------------------
这是最一般的闭包,任何教科书都有,函数在执行的时候循环早就运行完毕退出了,alert(i)此时的i你把它理解为引用、指针之类的东西就行了。

------解决方案--------------------
onload 触发循环,循环执行完毕i=4.点击时alert(i)就是4了
------解决方案--------------------
因为所有的i都是同一个变量,弹出的4是循环结束后i的值
只要再用一层闭包,把每次i的值独立出来就可以了


  window.onload = function(){
     for(var i=1; i < 4; i++){
        var id = document.getElementById("a" + i);
(function(i){
   id.onclick = function(){
             alert(i);//现在都是返回4
           }
})(i);
     }
  }

------解决方案--------------------
引用:
Quote: 引用:

这是最一般的闭包,任何教科书都有,函数在执行的时候循环早就运行完毕退出了,alert(i)此时的i你把它理解为引用、指针之类的东西就行了。

那为什么i这个局部变量没有消失呢??

就是因为用了闭包啊