JavaScript 变量作用域分析


Posted in Javascript onJuly 04, 2011
/* 代码1 */ 
var scope = "global "; 
function checkScope() { 
var scope = "local "; 
function childCheck() { 
var scope = "childLocal "; 
document.write(scope); 
} 
function childUndefined() { 
document.write(scope); 
var scope; 
} 
function childOverride() { 
scope = "childOverride "; 
document.write(scope); 
} 
document.write(scope); //输出"local" 
childCheck(); //输出"childLocal" 
childUndefined(); //输出"undefined" 
childOverride(); //输出"childOverride" 
document.write(scope); //输出"childOverride" 
} 
checkScope(); //输出"local childLocal undefinedchildOverride childOverride" 
document.write(scope); //输出"global "

全局作用域与局部作用域
全局(global)变量的作用域是全局的,在Javascript中处处有定义;而函数内部声明的变量是局部(local)变量,其作用域是局部性的,只在函数体内部有定义。对于下面的输出读者应不会感到意外。
/* 代码2 */ 
var scope = "global"; 
function checkScope() { 
var scope = "local"; 
document.write(scope); 
} 
checkScope(); //输出"local" 
document.write(scope); //输出"global"

全局变量作用域中使用变量可以不用var语句,但在声明局部变量是一定要使用var语句,否则会视为对全局变量的引用。看下面代码:
/* 代码3 */ 
var scope = "global"; 
function checkScope() { 
scope = "local"; 
document.write(scope); 
} 
checkScope(); //输出"local" 
document.write(scope); //输出"local"

没有块作用域
Javascript没有块级作用域,函数中声明的变量在整个函数中都是有定义的。对于下面的代码对于生疏的读者可能颇感意外:
/* 代码4 */ 
var scope = "global"; 
function checkScope() { 
document.write(scope); //语句4.1 
var scope = "local"; //语句4.2 
document.write(scope); 
} 
checkScope(); //输出"undefinedlocal"

由于语句4.1(var scope = "local";)声明的变量在整个checkScope函数作用域内都有效,因此在语句4.2(document.write(scope); )执行的时scope引用的是局部变量,而此时局部变量scope尚未定义,所以输出”undefined”。因此一个好的编程习惯是将所有的变量声明集中起来放在函数的开头。

在了解了上述内容之后,读者再看看代码1应该不会感到困惑了。

对象的属性变量
对象的属性变量比较容易理解,看一下下面的代码读者应该不会感到疑惑。

/* 代码5 */ 
var scope = "global "; 
var obj = new Object(); 
obj.scope = "object "; 
obj.checkScope = function () { 
var scope = "loacl "; 
document.write(scope); //输出"loacl" 
document.write(this.scope); //输出"object" 
document.write(window.scope); //输出"global" 
} 
obj.checkScope(); //输出"loacl object global"
Javascript 相关文章推荐
javascript实现的在当前窗口中漂浮框的代码
Mar 15 Javascript
40款非常棒的jQuery 插件和制作教程(系列一)
Oct 26 Javascript
js实现可拖动DIV的方法
Dec 17 Javascript
jquery文本框中的事件应用以输入邮箱为例
May 06 Javascript
js判断鼠标左、中、右键哪个被点击的方法
Jan 27 Javascript
jquery.uploadify插件在chrome浏览器频繁崩溃解决方法
Mar 01 Javascript
让JavaScript中setTimeout支持链式操作的方法
Jun 19 Javascript
JS输出空格的简单实现方法
Sep 08 Javascript
Canvas放置反弹效果随机图形(实例)
Aug 17 Javascript
mpvue全局引入sass文件的方法步骤
Mar 06 Javascript
vue组件命名和props命名代码详解
Sep 01 Javascript
用vue写一个日历
Nov 02 Javascript
JavaScript XML和string相互转化实现代码
Jul 04 #Javascript
JS对外部文件的加载及对IFRMAME的加载的实现,当加载完成后,指定指向方法(方法回调)
Jul 04 #Javascript
jQuery 对Select的操作备忘记录
Jul 04 #Javascript
javascript开发技术大全 第4章 直接量与字符集
Jul 03 #Javascript
javascript开发技术大全-第3章 js数据类型
Jul 03 #Javascript
javascript开发技术大全-第1章javascript概述
Jul 03 #Javascript
js 字符串转化成数字的代码
Jun 29 #Javascript
You might like
德生PL450的电路分析和低放电路的改进办法
2021/03/02 无线电
php mysql数据库操作类
2008/06/04 PHP
PHP传值到不同页面的三种常见方式及php和html之间传值问题
2015/11/19 PHP
基于thinkphp6.0的success、error实现方法
2019/11/05 PHP
PHP安装扩展mcrypt以及相关依赖项深入讲解
2021/03/04 PHP
理解JAVASCRIPT中hasOwnProperty()的作用
2013/06/05 Javascript
基于jquery的文章中所有图片width大小批量设置方法
2013/08/01 Javascript
jQuery支持动态参数将函数绑定到事件上的方法
2015/03/17 Javascript
BootstrapValidator不触发校验的实现代码
2016/09/28 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
2016/12/26 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
2017/05/17 Javascript
vue高德地图之玩转周边
2017/06/16 Javascript
Javascript(es2016) import和require用法和区别详解
2017/08/11 Javascript
vue富文本编辑器组件vue-quill-edit使用教程
2018/09/21 Javascript
js实现每日签到功能
2018/11/29 Javascript
jQuery each和js forEach用法比较
2019/02/27 jQuery
浅谈Vue页面级缓存解决方案feb-alive(上)
2019/04/14 Javascript
个人小程序接入支付解决方案
2019/05/23 Javascript
JavaScript实现页面中录音功能的方法
2019/06/04 Javascript
nodejs中各种加密算法的实现详解
2019/07/11 NodeJs
小程序富文本提取图片可放大缩小
2020/05/26 Javascript
微信小程序实现点击页面出现文字
2020/09/21 Javascript
Django中使用celery完成异步任务的示例代码
2018/01/23 Python
python实时检测键盘输入函数的示例
2019/07/17 Python
pycharm快捷键汇总
2020/02/14 Python
Python OpenCV实现测量图片物体宽度
2020/05/27 Python
购买原创艺术品:Zatista
2019/11/09 全球购物
JBL美国官方商店:扬声器、耳机等
2019/12/01 全球购物
护理专业个人求职简历的自我评价
2013/10/13 职场文书
管道维修工岗位职责
2013/12/27 职场文书
党员培训思想汇报
2014/01/07 职场文书
《大江保卫战》教学反思
2014/04/11 职场文书
保护环境倡议书500字
2014/05/19 职场文书
浪漫婚礼主题活动策划方案
2014/09/15 职场文书
2014年办公室人员工作总结
2014/12/09 职场文书
基于angular实现树形二级表格
2021/10/16 Javascript