探讨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 相关控件的事件操作分解
Aug 03 Javascript
javascript转换字符串为dom对象(字符串动态创建dom)
May 10 Javascript
为JavaScript提供睡眠功能(sleep) 自编译JS引擎
Aug 16 Javascript
js综合应用实例简单的表格统计
Sep 03 Javascript
jquery实现的鼠标拖动排序Li或Table
May 04 Javascript
jQuery中:last-child选择器用法实例
Dec 31 Javascript
JavaScript使用encodeURI()和decodeURI()获取字符串值的方法
Aug 04 Javascript
JS对象创建的几种方式整理
Feb 28 Javascript
js数组去重的N种方法(小结)
Jun 07 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
基于Vue的侧边目录组件的实现
Feb 05 Javascript
简单了解three.js 着色器材质
Aug 03 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
PHP在线生成二维码代码(google api)
2013/06/03 PHP
PHP数据库链接类(PDO+Access)实例分享
2013/12/05 PHP
PHP采集类snoopy详细介绍(snoopy使用教程)
2014/06/19 PHP
通过修改配置真正解决php文件上传大小限制问题(nginx+php)
2015/09/23 PHP
PHP版本升级到7.x后wordpress的一些修改及wordpress技巧
2015/12/25 PHP
thinkPHP3.1验证码的简单实现方法
2016/04/22 PHP
php通过会话控制实现身份验证实例
2016/10/18 PHP
php  单例模式详细介绍及实现源码
2016/11/05 PHP
Asp.net下利用Jquery Ajax实现用户注册检测(验证用户名是否存)
2010/09/12 Javascript
一些常用弹出窗口/拖放/异步文件上传等实用代码
2013/01/06 Javascript
node.js中watch机制详解
2014/11/17 Javascript
jQuery中Form相关知识汇总
2015/01/06 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
Javascript验证方法大全
2015/09/21 Javascript
正则表达式优化JSON字符串的技巧
2015/12/24 Javascript
AngularJS身份验证的方法
2016/02/17 Javascript
JavaScript 过滤关键字
2017/03/20 Javascript
nodejs操作mysql实现增删改查的实例
2017/05/28 NodeJs
深入浅析Vue不同场景下组件间的数据交流
2017/08/15 Javascript
浅谈Angular4实现热加载开发旅程
2017/09/08 Javascript
vue轮播图插件vue-concise-slider的使用
2018/03/13 Javascript
Angularjs Ng_repeat中实现复选框选中并显示不同的样式方法
2018/09/12 Javascript
Threejs实现滴滴官网首页地球动画功能
2020/07/13 Javascript
JS获取一个字符串中指定字符串第n次出现的位置
2021/02/10 Javascript
在Python中使用模块的教程
2015/04/27 Python
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
python实现将range()函数生成的数字存储在一个列表中
2020/04/02 Python
python torch.utils.data.DataLoader使用方法
2020/04/02 Python
HTML5 Canvas draw方法制作动画效果示例
2013/07/11 HTML / CSS
JOSEPH官网:英国奢侈时尚品牌
2018/01/31 全球购物
Fossil加拿大官网:化石手表、手袋、首饰及配饰
2019/04/23 全球购物
当当网软件测试笔试题
2015/11/24 面试题
北京振戎融通Java面试题
2015/09/03 面试题
社会保险接收函
2014/01/12 职场文书
环保建议书作文300字
2015/09/14 职场文书
JavaScript异步操作中串行和并行
2021/11/20 Javascript