探讨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 选择文件夹对话框(web)
Jul 07 Javascript
js控制表单不能输入空格的小例子
Nov 20 Javascript
有关Promises异步问题详解
Nov 13 Javascript
基于原生js淡入淡出函数封装(兼容IE)
Oct 20 Javascript
xmlplus组件设计系列之列表(4)
Apr 26 Javascript
JS实现的全排列组合算法示例
Oct 09 Javascript
详解layui弹窗父子窗口之间传参数的方法
Jan 16 Javascript
原生JS实现列表子元素顺序反转的方法分析
Jul 02 Javascript
使用Object.defineProperty如何巧妙找到修改某个变量的准确代码位置
Nov 02 Javascript
js判断密码强度的方法
Mar 18 Javascript
浅谈Vue 自动化部署打包上线
Jun 14 Javascript
解决Vue @submit 提交后不刷新页面问题
Jul 18 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
深入理解curl类,可用于模拟get,post和curl下载
2013/06/08 PHP
php 一维数组的循环遍历实现代码
2017/04/10 PHP
php 使用curl模拟ip和来源进行访问的实现方法
2017/05/02 PHP
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
Extjs4中tree的拖拽功能(可以两棵树之间拖拽) 简单实例
2013/12/08 Javascript
jquery如何通过name名称获取当前name的value值
2013/12/20 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
2014/06/29 Javascript
字段太多jquey快速清空表单内容方法
2014/08/21 Javascript
JavaScript link方法入门实例(给字符串加上超链接)
2014/10/17 Javascript
JavaScript中string对象
2015/06/12 Javascript
jQuery实用技巧必备(上)
2015/11/02 Javascript
跟我学习javascript的var预解析与函数声明提升
2015/11/16 Javascript
Js遍历键值对形式对象或Map形式的方法
2016/08/08 Javascript
JS不完全国际化&本地化手册 之 理论篇
2016/09/27 Javascript
Vue计算属性的使用
2017/08/04 Javascript
Vue波纹按钮组件制作
2018/04/30 Javascript
React项目动态设置title标题的方法示例
2018/09/26 Javascript
小程序最新获取用户昵称和头像的方法总结
2019/09/23 Javascript
如何基于JavaScript判断图片是否加载完成
2019/12/28 Javascript
[01:00:14]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第三场
2018/04/10 DOTA
浅谈python字符串方法的简单使用
2016/07/18 Python
Python实现SMTP发送邮件详细教程
2021/03/02 Python
[原创]使用豆瓣提供的国内pypi源
2017/07/02 Python
tensorflow实现KNN识别MNIST
2018/03/12 Python
Selenium鼠标与键盘事件常用操作方法示例
2018/08/13 Python
查看python安装路径及pip安装的包列表及路径
2019/04/03 Python
Python列表与元组的异同详解
2019/07/02 Python
python画微信表情符的实例代码
2019/10/09 Python
python实现实时视频流播放代码实例
2020/01/11 Python
django rest framework使用django-filter用法
2020/07/15 Python
详解Css3新特性应用之过渡与动画
2017/01/10 HTML / CSS
电钳专业个人求职信
2014/01/04 职场文书
公司领导班子群众路线四风问题对照检查材料
2014/10/02 职场文书
情感电台广播稿
2015/08/18 职场文书
python中如何对多变量连续赋值
2021/06/03 Python
你真的会用Mysql的explain吗
2022/03/31 MySQL