探讨JavaScript中声明全局变量三种方式的异同


Posted in Javascript onDecember 03, 2013

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

方式1

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

方式2

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

方式3

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;

1,for in window

for(a in window){
 if(a=='a1'||a=='a2'||a=='a3'){
  alert(a)
 }
}
IE6/7/8/9:只弹出了a3,说明通过第一,二种方式声明的全局变量通过for in window时将获取不到。
Firefox/Chrome/Safari/Opera :a1,a2,a3都弹出了,说明三种方式声明的全局变量,通过for in window时都能获取到。

2,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')}

结果如下

探讨JavaScript中声明全局变量三种方式的异同

可以看到,
1,delete a2所有浏览器都是false。即通过var声明的变量无法删除,所有浏览器表现一致。这在犀牛书上也有提到。

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
 } 
}

Javascript 相关文章推荐
Javascript 陷阱 window全局对象
Nov 26 Javascript
通过Mootools 1.2来操纵HTML DOM元素
Sep 15 Javascript
js页面跳转常用的几种方式
Nov 25 Javascript
基于jquery的网站幻灯片切换效果焦点图代码
Sep 15 Javascript
js全屏显示显示代码的三种方法
Nov 11 Javascript
深入理解JavaScript中的传值与传引用
Dec 09 Javascript
调用HttpHanlder的几种返回方式小结
Dec 20 Javascript
javascript框架设计之浏览器的嗅探和特征侦测
Jun 23 Javascript
jQuery position() 函数详解以及jQuery中position函数的应用
Dec 14 Javascript
微信小程序实现自定义加载图标功能
Jul 19 Javascript
解决echarts echarts数据动态更新和dataZoom被重置问题
Jul 20 Javascript
vue3.0实现点击切换验证码(组件)及校验
Nov 18 Vue.js
解析JavaScript中delete操作符不能删除的对象
Dec 03 #Javascript
解析Javascript小括号“()”的多义性
Dec 03 #Javascript
解析Javascript中中括号“[]”的多义性
Dec 03 #Javascript
jquery将一个表单序列化为一个对象的方法
Dec 02 #Javascript
jQuery获得内容和属性方法及示例
Dec 02 #Javascript
jquery如何实现锚点链接之间的平滑滚动
Dec 02 #Javascript
jquery通过a标签删除table中的一行的代码
Dec 02 #Javascript
You might like
用PHP调用Oracle存储过程
2006/10/09 PHP
php 将bmp图片转为jpg等其他任意格式的图片
2009/06/21 PHP
PHP中Fatal error session_start()错误解决步骤
2014/08/05 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
33个优秀的jQuery 教程分享(幻灯片、动画菜单)
2011/07/08 Javascript
JS下拉缓冲菜单示例代码
2013/08/30 Javascript
Javascript排序算法之计数排序的实例
2014/04/05 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 图片库
2015/01/09 Javascript
js获取json元素数量的方法
2015/01/27 Javascript
基于Bootstrap实现图片轮播效果
2016/05/22 Javascript
javascript中setAttribute兼容性用法分析
2016/12/12 Javascript
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
2017/08/17 jQuery
vuex的使用及持久化state的方式详解
2018/01/23 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
2018/09/25 Javascript
微信小程序防止多次点击跳转(函数节流)
2019/09/19 Javascript
js实现滑动滑块验证登录
2020/07/24 Javascript
[01:32]2014DOTA2西雅图邀请赛 CIS我们有信心进入正赛
2014/07/08 DOTA
[00:32]2018DOTA2亚洲邀请赛VGJ.T出场
2018/04/03 DOTA
使用Python下载Bing图片(代码)
2013/11/07 Python
python中的不可变数据类型与可变数据类型详解
2018/09/16 Python
使用python分析统计自己微信朋友的信息
2019/07/19 Python
pyqt5 QScrollArea设置在自定义侧(任何位置)
2019/09/25 Python
python 经典数字滤波实例
2019/12/16 Python
Jupyter加载文件的实现方法
2020/04/14 Python
CSS3实现3D翻书效果
2016/06/20 HTML / CSS
交通专业个人自荐信格式
2013/09/23 职场文书
公司经理任命书
2014/06/05 职场文书
社区爱国卫生月活动总结
2014/06/30 职场文书
硕士生找工作求职信
2014/07/05 职场文书
离婚协议书包括哪些内容
2014/10/16 职场文书
介绍信格式
2015/01/30 职场文书
学校勤俭节约倡议书
2015/04/29 职场文书
Nginx工作原理和优化总结。
2021/04/02 Servers
jackson json序列化实现首字母大写,第二个字母需小写
2021/06/29 Java/Android
Win11 Dev 预览版25174.1000发布 (附更新修复内容汇总)
2022/08/05 数码科技