探讨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 相关文章推荐
基于jQuery的自动完成插件
Feb 03 Javascript
javascript获取函数名称、函数参数、对象属性名称的代码实例
Apr 12 Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 Javascript
js计算任意值之间随机数的方法
Jan 16 Javascript
JavaScript判断浏览器类型的方法
Feb 10 Javascript
js console.log打印对像与数组用法详解
Jan 21 Javascript
Node.js文件操作方法汇总
Mar 22 Javascript
jQuery EasyUI的TreeGrid查询功能实现方法
Aug 08 jQuery
JavaScript实现三级级联特效
Nov 05 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
Jul 09 Javascript
vue中选中多个选项并且改变选中的样式的实例代码
Sep 16 Javascript
如何利用js在两个html窗口间通信
Apr 27 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
基于ubuntu下nginx+php+mysql安装配置的具体操作步骤
2013/04/28 PHP
解析mysql left( right ) join使用on与where筛选的差异
2013/06/18 PHP
PHP数据库操作Helper类完整实例
2016/05/11 PHP
PHP 模拟登陆功能实例详解
2019/09/10 PHP
JavaScript 原型链学习总结
2010/10/29 Javascript
javascript获取URL参数与参数值的示例代码
2013/12/20 Javascript
jQuery实现html表格动态添加新行的方法
2015/05/28 Javascript
微信公众号开发 自定义菜单跳转页面并获取用户信息实例详解
2016/12/08 Javascript
JS中from 表单序列化提交的代码
2017/01/20 Javascript
使用jQuery,Angular实现登录界面验证码详解
2017/04/27 jQuery
原生JavaScript实现的简单放大镜效果示例
2018/02/07 Javascript
Vue项目部署在Spring Boot出现页面空白问题的解决方案
2018/11/26 Javascript
javascript实现贪吃蛇小游戏
2020/07/28 Javascript
[47:21]Liquid vs TNC Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
[43:03]LGD vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
python自动查询12306余票并发送邮箱提醒脚本
2018/05/21 Python
解决Tensorflow安装成功,但在导入时报错的问题
2018/06/13 Python
python字符串和常用数据结构知识总结
2019/05/21 Python
tensorflow实现训练变量checkpoint的保存与读取
2020/02/10 Python
Django ModelForm操作及验证方式
2020/03/30 Python
pandas中的ExcelWriter和ExcelFile的实现方法
2020/04/24 Python
Python使用Selenium实现淘宝抢单的流程分析
2020/06/23 Python
python 实现图片批量压缩的示例
2020/12/18 Python
CSS3实现简易版的刮刮乐效果
2016/09/27 HTML / CSS
波兰家居和花园家具专家:4Home
2019/05/26 全球购物
房地产出纳岗位职责
2013/12/01 职场文书
教师自我评价范文
2013/12/16 职场文书
费用会计岗位职责
2014/01/01 职场文书
《一件运动衫》教学反思
2014/02/19 职场文书
公司建议书怎么写
2014/05/15 职场文书
行政助理岗位职责
2015/02/10 职场文书
个人总结与自我评价2015
2015/03/11 职场文书
初中政治教学反思
2016/02/23 职场文书
导游词之徐州云龙湖
2019/11/19 职场文书
Nginx开启Brotli压缩算法实现过程详解
2021/03/31 Servers
搭建Yolov5服务器
2022/04/30 Servers