探讨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 相关文章推荐
JS的Document属性和方法小结
Sep 17 Javascript
JS实现OCX控件的事件响应示例
Sep 17 Javascript
javascript的变量、传值、传址、参数之间关系
Jul 26 Javascript
jQuery解析返回的xml和json方法详解
Jan 05 Javascript
Html5 js实现手风琴效果
Apr 17 Javascript
vue实现ToDoList简单实例
Feb 07 Javascript
js输入框使用正则表达式校验输入内容的实例
Feb 12 Javascript
原生js实现秒表计时器功能
Feb 16 Javascript
Vue.js实例方法之生命周期详解
Jul 03 Javascript
详解js访问对象的属性和方法
Oct 25 Javascript
vue项目打包后上传至GitHub并实现github-pages的预览
May 06 Javascript
Vue 微信端扫描二维码苹果端却只能保存图片问题(解决方法)
Jan 19 Javascript
解析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
CPU步进是什么意思?i3-9100F B0步进和U0步进区别知识科普
2020/03/17 数码科技
PHP curl 并发最佳实践代码分享
2012/09/05 PHP
PHP内核探索:变量概述
2014/01/30 PHP
php自动识别文字编码并转换为目标编码的方法
2015/08/08 PHP
thinkphp项目如何自定义微信分享描述内容
2017/02/20 PHP
ThinkPHP 3.2.2实现事务操作的方法
2017/05/05 PHP
[原创]php正则删除html代码中class样式属性的方法
2017/05/24 PHP
js中更短的 Array 类型转换
2011/10/30 Javascript
简单的Jquery全选功能
2013/11/07 Javascript
js获取当前日期前七天的方法
2015/02/28 Javascript
浅析JavaScript动画
2015/06/10 Javascript
JS给Array添加是否包含字符串的简单方法
2016/10/29 Javascript
使用Ajax生成的Excel文件并下载的实例
2016/11/21 Javascript
浅谈react.js 之 批量添加与删除功能
2017/04/17 Javascript
详解Vue2中组件间通信的解决全方案
2017/07/28 Javascript
JavaScript实现二叉树定义、遍历及查找的方法详解
2017/12/20 Javascript
mint-ui 时间插件使用及获取选择值的方法
2018/02/09 Javascript
javascript实现弹出层效果
2019/12/10 Javascript
vue中使用腾讯云Im的示例
2020/10/23 Javascript
Python的Django框架中自定义模版标签的示例
2015/07/20 Python
Python 查看文件的编码格式方法
2017/12/21 Python
火车票抢票python代码公开揭秘!
2018/03/08 Python
django Serializer序列化使用方法详解
2018/10/16 Python
python 获取url中的参数列表实例
2018/12/18 Python
对python mayavi三维绘图的实现详解
2019/01/08 Python
安装完Python包然后找不到模块的解决步骤
2020/02/13 Python
Python基于yaml文件配置logging日志过程解析
2020/06/23 Python
Python代码覆盖率统计工具coverage.py用法详解
2020/11/25 Python
浅谈基于Canvas的手绘风格图形库Rough.js
2018/03/19 HTML / CSS
智利最大的网上商店:Linio智利
2016/11/24 全球购物
实习期自我鉴定
2013/10/11 职场文书
工作的心得体会
2013/12/31 职场文书
就业意向书范文
2014/04/01 职场文书
购房意向书范本
2014/04/01 职场文书
2014年银行柜员工作总结
2014/11/12 职场文书
如何使用 resize 实现图片切换预览功能
2021/08/23 HTML / CSS