本文深入探讨JavaScript中声明全局变量的三种主要方式:使用var关键字、直接赋值以及通过window对象属性。文章对比了不同声明方式在IE、Firefox、Chrome等主流浏览器中的行为差异,重点分析了for in遍历、delete操作符以及in运算符的表现,揭示了非配置属性与可配置属性在删除和枚举时的关键区别。
JavaScript全局变量声明基础
变量及其声明机制是编程语言的基础概念,初学者通常能迅速掌握。在JavaScript中,声明变量的语法同样直观,即使用关键字var后接变量标识符。
三种全局变量声明方式详解
第一种声明方式
代码示例为var test;或var test = 5。需要特别注意的是,如果该语句位于function函数内部,它将声明为局部变量而非全局变量。这是通过var关键字声明全局变量的第一种典型方式。
第二种声明方式
代码示例为test = 5;。这种方式省略了var关键字,直接对标识符test进行赋值,从而隐式地声明了一个全局变量test。即使这段代码位于function函数内部,当该函数执行完毕后,test也会成为全局变量。
第三种声明方式
代码示例为window.test;或window.test = 5;。这种方式常用于匿名函数执行后,将某些函数或变量公开到全局作用域中。例如,在JQuery1.5版本的代码末尾可以看到类似的使用模式。
代码示例为window.jQuery = window.$ = jQuery;。
如果仅仅使用变量test,这三种声明方式在取值时似乎没有区别,例如alert(test)都会显示5。然而,在某些特定场景下,这三种方式存在显著差异。下面分别按上述三种方式声明三个变量a1、a2和a3进行对比。
代码示例为: a1 = 11; var a2 = 22; window.a3 = 33;
不同声明方式在浏览器中的行为差异
对比点一:使用for in遍历window对象
代码示例为: for(a in window){ if(a=='a1'||a=='a2'||a=='a3'){ alert(a) } } 在IE6/7/8/9浏览器中,仅弹出a3,这表明通过第一种(var)和第二种(隐式赋值)方式声明的全局变量,在使用for in遍历window对象时无法被获取。而在Firefox、Chrome、Safari和Opera浏览器中,a1、a2和a3均被弹出,说明这三种方式声明的全局变量在这些浏览器中通过for in遍历均可获取。
对比点二:使用delete操作符删除变量
代码示例为: try { alert(delete a1); }catch(e){alert('无法delete a1')}
代码示例为: try{ alert(delete a2); }catch(e){alert('无法delete a2')}
代码示例为: try{ alert(delete a3); }catch(e){alert('无法delete a3')}
执行结果如下

从可以看出: 1. 在所有浏览器中,delete a2的结果均为false。这意味着通过var声明的变量无法被删除,所有浏览器的表现一致。这一特性在《JavaScript权威指南》(犀牛书)中也有提及。 2. 通过window.a3方式声明的全局变量,在IE6/7/8中均无法删除,但在IE9、Firefox、Chrome、Safari和Opera中可以成功删除。
尽管存在上述两点差异,当使用in运算符检查时,所有变量均返回true。
代码示例为: alert('a1' in window);//true alert('a2' in window);//true alert('a3' in window);//true 当使用with语句打开window对象闭包时,所有浏览器的表现也是一致的,如下所示。
代码示例为: with(window){ if(a1){ alert(a1);//11 } if(a2){ alert(a2);//22 } if(a3){ alert(a3);//33 } }