javascript全局变量详解

痛定思痛。 2022-08-06 03:25 156阅读 0赞

**全局变量时什么？**

var test = 3; // 这种其实创建的是一个variable  
test = 3; // 这种其实是在global下创建一个property  
window.test = 3; // 同上一种，但通用性不好，不在浏览器环境下会出问题  
所以比较正统的符合ECMA的应该是Global.test = 3;  
但是一般来说Global是访问不到的，那么就得想办法弄出来  
按ECMAv3的标准来说，正常调用一个函数的话，其内部的this就是Global，所以这么写  
var global = (function() \{ return this; \}());  
但是ECMAv5又出了一个strict模式，在该模式下，如果正常调用一个函数，其内部的this是undefined  
好在ECMAv5里又有indirect eval call，这在你的另一篇中有提到过，indirect eval call永远在global下执行，所以那个时候的this就是Global了  
var global = (1,eval)('(this)');  
所以综合一下，获取global的方法是：  
var global = (function() \{ return this || (1,eval)('(this)'); \}());  
再随后global.tes = 3;就安全了 以下内容来自：[**JavaScript教程网**][JavaScript]

是一门语言最基本的概念，初学者都会很快掌握。JavaScript中声明变量也是如此，很简单var（关键字）+变量名(标识符)。

**方式1**

需注意的是该句不能包含在function内，否则是局部变量。这是第一种方式声明全局变量。

**方式2**

没有使用var，直接给标识符test赋值，这样会隐式的声明了全局变量test。即使该语句是在一个function内，当该function被执行后test变成了全局变量。

**方式3**

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>window.test;</code> 
     </div> 
     <div> 
      <code>window.test = 5;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

这种方式经常被用到一个匿名函数执行后将一些函数公开到全局。 如JQuery1.5中最末一句

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>window.jQuery = window.$ = jQuery;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

如果只是使用变量test，那么三种方式将没有什么区别。比如：alert(test) 都将显示5。但三种方式在某些情况下还是有区别的。分别按以上三种方式声明三个变量a1,a2,a3。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>a1 = 11;</code> 
     </div> 
     <div> 
      <code>var</code> 
      <code>a2 = 22;</code> 
     </div> 
     <div> 
      <code>window.a3 = 33;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

**1，for in window**

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>for</code> 
      <code>(a </code> 
      <code>in</code> 
      <code> window){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code> 
      <code>(a==</code> 
      <code>'a1'</code> 
      <code>||a==</code> 
      <code>'a2'</code> 
      <code>||a==</code> 
      <code>'a3'</code> 
      <code>){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(a)</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

IE6/7/8/9：只弹出了a3，说明通过第一，二种方式声明的全局变量通过for in window时将获取不到。  
Firefox/Chrome/Safari/Opera ：a1,a2,a3都弹出了，说明三种方式声明的全局变量，通过for in window时都能获取到。

**2，delete**

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> 
    <div>
      8 
    </div> 
    <div>
      9 
    </div> 
    <div>
      10 
    </div> 
    <div>
      11 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>try</code> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(</code> 
      <code>delete</code> 
      <code>a1);</code> 
     </div> 
     <div> 
      <code>}</code> 
      <code>catch</code> 
      <code>(e){alert(</code> 
      <code>'无法delete a1'</code> 
      <code>)}</code> 
     </div> 
     <div>
       &nbsp; 
     </div> 
     <div> 
      <code>try</code> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(</code> 
      <code>delete</code> 
      <code>a2);</code> 
     </div> 
     <div> 
      <code>}</code> 
      <code>catch</code> 
      <code>(e){alert(</code> 
      <code>'无法delete a2'</code> 
      <code>)}</code> 
     </div> 
     <div>
       &nbsp; 
     </div> 
     <div> 
      <code>try</code> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(</code> 
      <code>delete</code> 
      <code>a3);</code> 
     </div> 
     <div> 
      <code>}</code> 
      <code>catch</code> 
      <code>(e){alert(</code> 
      <code>'无法delete a3'</code> 
      <code>)}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

结果如下

![2011031817282487.jpg][]

可以看到，  
1，delete a2所有浏览器都是false。即通过var声明的变量无法删除，所有浏览器表现一致。这在犀牛书上也有提到。  
2，通过window.a3方式声明的全局变量在IE6/7/8中均无法删除，IE9/Firefox/Chrome/Safari/Opera中却可以。  
  
  
虽然有以上两点不同，但当用in运算时，都返回true。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>alert(</code> 
      <code>'a1'</code> 
      <code>in</code> 
      <code>window);</code> 
      <code>//true</code> 
     </div> 
     <div> 
      <code>alert(</code> 
      <code>'a2'</code> 
      <code>in</code> 
      <code>window);</code> 
      <code>//true</code> 
     </div> 
     <div> 
      <code>alert(</code> 
      <code>'a3'</code> 
      <code>in</code> 
      <code>window);</code> 
      <code>//true</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

用with打开对象window闭包时，所有浏览器也表现一致，如下

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> 
    <div>
      8 
    </div> 
    <div>
      9 
    </div> 
    <div>
      10 
    </div> 
    <div>
      11 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>with</code> 
      <code>(window){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code> 
      <code>(a1){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(a1);</code> 
      <code>//11</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code> 
      <code>(a2){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(a2);</code> 
      <code>//22</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code> 
      <code>(a3){ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>alert(a3);</code> 
      <code>//33</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}&nbsp;&nbsp; </code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

[JavaScript]: http://www.17javascript.com/
[2011031817282487.jpg]: /images/20220806/55e9be5e8e3f488aa512f4c7aac04ebf.png