探讨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原型继承之基础机制分析
Aug 26 Javascript
基于jquery的不规则矩形的排列实现代码
Apr 16 Javascript
jQuery滚动条插件nanoscroller使用指南
Apr 21 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
Aug 10 Javascript
Bootstrap每天必学之表单
Nov 23 Javascript
jquery使用Cookie和JSON记录用户最近浏览历史
Apr 19 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
Nov 11 Javascript
vue项目中做编辑功能传递数据时遇到问题的解决方法
Dec 19 Javascript
Vue2.0 从零开始_环境搭建操作步骤
Jun 14 Javascript
vue实现前台列表数据过滤搜索、分页效果
May 28 Javascript
微信小程序实现pdf、word等格式文件上传的方法
Sep 10 Javascript
Vue 一键清空表单的实现方法
Feb 07 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
十大“创意”战术!
2020/03/04 星际争霸
PHP中替换键名的简易方法示例详解
2014/01/07 PHP
Yii2前后台分离及migrate使用(七)
2016/05/04 PHP
js本身的局限性 别让javascript做太多事
2010/03/23 Javascript
javascript跨域刷新实现代码
2011/01/01 Javascript
json实现前后台的相互传值详解
2015/01/05 Javascript
JQuery使用index方法获取Jquery对象数组下标的方法
2015/05/18 Javascript
jQuery中实现prop()函数控制多选框(全选,反选)
2016/08/19 Javascript
js实现下拉框效果(select)
2017/03/28 Javascript
Angular通过指令动态添加组件问题
2018/07/09 Javascript
AngularJS使用$http配置对象方式与服务端交互方法
2018/08/13 Javascript
Vue的生命周期操作示例
2019/09/17 Javascript
JS实现图片切换特效
2019/12/23 Javascript
Vue的data、computed、watch源码浅谈
2020/04/04 Javascript
基于Python实现通过微信搜索功能查看谁把你删除了
2016/01/27 Python
Python中函数参数设置及使用的学习笔记
2016/05/03 Python
Python实现压缩与解压gzip大文件的方法
2016/09/18 Python
关于Django外键赋值问题详解
2017/08/13 Python
Python File readlines() 使用方法
2018/03/19 Python
详解django三种文件下载方式
2018/04/06 Python
python迭代dict的key和value的方法
2018/07/06 Python
python Django的web开发实例(入门)
2019/07/31 Python
python创建子类的方法分析
2019/11/28 Python
HTML5基于flash实现播放RTMP协议视频的示例代码
2020/12/04 HTML / CSS
白兰氏健康Mall:BRAND’S
2017/11/13 全球购物
意大利自行车商店:Cingolani Bike Shop
2019/09/03 全球购物
市场专员岗位职责
2014/02/14 职场文书
工作岗位说明书模板
2014/05/09 职场文书
计算机科学技术自荐信
2014/06/12 职场文书
2014年四风问题个人对照自查剖析材料
2014/09/15 职场文书
学生上课说话检讨书
2014/10/25 职场文书
2014年环保局工作总结
2014/12/11 职场文书
大学生暑期实践报告
2015/07/13 职场文书
物业保洁员管理制度
2015/08/05 职场文书
CSS的class与id常用的命名规则
2021/05/18 HTML / CSS
关于JavaScript 中 if包含逗号表达式
2021/11/27 Javascript