探讨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开源框架-jQuery使用手册(1)
Mar 10 Javascript
msn上的tab功能Firefox对childNodes处理的一个BUG
Jan 21 Javascript
JS 创建对象(常见的几种方法)
Nov 03 Javascript
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
js中window.open打开一个新的页面
Aug 10 Javascript
充分发挥Node.js程序性能的一些方法介绍
Jun 23 Javascript
jQuery学习笔记之Ajax用法实例详解
Dec 01 Javascript
javascript中使用未定义变量或值的情况分析
Jul 19 Javascript
解决vue props 拿不到值的问题
Sep 11 Javascript
利用layer实现表单完美验证的方法
Sep 26 Javascript
原生JavaScript实现拖动校验功能
Sep 29 Javascript
vue实现在data里引入相对路径
Jun 05 Vue.js
解析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
使用Linux五年积累的一些经验技巧
2013/06/20 PHP
Laravel 5框架学习之日期,Mutator 和 Scope
2015/04/08 PHP
网页的分页下标生成代码(PHP后端方法)
2016/02/03 PHP
Laravel搭建后台登录系统步骤详解
2016/07/26 PHP
2017年最好用的9个php开发工具推荐(超好用)
2017/10/23 PHP
PHP论坛实现积分系统的思路代码详解
2020/06/01 PHP
List all the Databases on a SQL Server
2007/06/21 Javascript
javascript document.images实例
2008/05/27 Javascript
js 方法实现返回多个数据的代码
2009/04/30 Javascript
用Javascript 和 CSS 实现脚注(Footnote)效果
2009/09/09 Javascript
小议javascript 设计模式 推荐
2009/10/28 Javascript
jQuery初学:find()方法及children方法的区别分析
2011/01/31 Javascript
jquery插件开发之实现google+圈子选择功能
2014/03/10 Javascript
Nodejs爬虫进阶教程之异步并发控制
2016/02/15 NodeJs
真正好用的js验证上传文件大小的简单方法
2016/10/27 Javascript
80%应聘者都不及格的JS面试题
2017/03/21 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
AngularJS改变元素显示状态
2017/04/20 Javascript
JavaScript瀑布流布局实现代码
2017/05/06 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
2018/11/02 Javascript
javascript异步编程的六种方式总结
2019/05/17 Javascript
layui实现左侧菜单点击右侧内容区显示
2019/07/26 Javascript
javascript设计模式之迭代器模式
2020/01/30 Javascript
[01:14]3.19DOTA2发布会 三代刀塔人第二代
2014/03/25 DOTA
Python3按一定数据位数格式处理bin文件的方法
2019/01/24 Python
python中property属性的介绍及其应用详解
2019/08/29 Python
python 通过视频url获取视频的宽高方式
2019/12/10 Python
TripAdvisor土耳其网站:全球知名旅行社区,真实旅客评论
2017/04/17 全球购物
自我评价范文
2013/12/22 职场文书
毕业生的自我评价范文
2013/12/31 职场文书
护士岗位求职应聘自荐书范文
2014/02/12 职场文书
动漫设计与制作专业推荐信
2014/07/07 职场文书
班子个人四风问题整改措施
2014/10/04 职场文书
涨价通知怎么写
2015/04/23 职场文书
简历中的自我评价应该这样写!
2019/07/12 职场文书
Prometheus 监控MySQL使用grafana展示
2021/08/30 MySQL