今天在寫個一段js代碼出現了變量值出現異常的問題,把代碼做了提取,簡單的如下面
<script>
function a1(){
var a = [{"name":"1"},{"name":"2"},{"name":"3"}];
for(i=0;i<a.length;i++){
alert(i+" first");
a2(a[i]);
alert(i+" second");
}
}
function a2(obj){
for (i in obj) {
}
return "hello";
}
</script>
<body onload="a1();">
在第一次alert(i)是 0 first
在第二次alert(i)是 name second
為什么會出現這樣的情況,明明在a2函數傳進去的是實參,并且也沒有對參數a[i]進行改寫
在反復查看問題后發現是i變量的問題,在函數a1()中,i被定義成為了全局變量,而在函數a2()中,i又是一個全局變量,所以在a2的for (i in obj) 循環中i被重新賦值成"name"
這個烏龍是沒有養成在一些臨時函數定義成局部變量造成的,特別是在一些for,while,if的操作中,臨時變量必須定義成局部變量否則會出現全局變量被改寫的情況。
再回顧一下定義全局變量/局部變量的規則
在函數外部,使用var,或直接使用變量,如var a=1;或 a=1; 就定義了全局變量
在函數內部,直接使用變量,如a=1;也定義了全局變量
在函數內部,使用var進行定義就是局部變量
修改一下上面的代碼
<script>
function a1(){
var a = [{"name":"1"},{"name":"2"},{"name":"3"}];
for(var i=0;i<a.length;i++){
alert(i+" first");
a2(a[i]);
alert(i+" second");
}
}
function a2(obj){
for (var i in obj) {
}
return "hello";
}
</script>
<body onload="a1();">