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 相关文章推荐
Code:findPosX 和 findPosY
Dec 20 Javascript
一页面多XMLHttpRequest对象
Jan 22 Javascript
Javascript 代码也可以变得优美的实现方法
Jun 22 Javascript
JS 毫秒转时间示例代码
Sep 22 Javascript
js写的评论分页(还不错)
Dec 23 Javascript
写出高效jquery代码的19条指南
Mar 19 Javascript
jQuery统计上传文件大小的方法
Jan 24 Javascript
用AngularJS的指令实现tabs切换效果
Aug 31 Javascript
Vue.js组件tabs实现选项卡切换效果
Dec 01 Javascript
详解利用 Vue.js 实现前后端分离的RBAC角色权限管理
Sep 15 Javascript
Vue.set 全局操作简单示例
Sep 19 Javascript
原生js+css实现tab切换功能
Sep 17 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
PHP管理内存函数 memory_get_usage()使用介绍
2012/09/23 PHP
Windows下的PHP安装文件线程安全和非线程安全的区别
2014/04/23 PHP
php实现paypal 授权登录
2015/05/28 PHP
ECshop 迁移到 PHP7版本时遇到的兼容性问题
2016/02/15 PHP
Codeigniter里的无刷新上传的实现代码
2019/04/14 PHP
DHTML 中的绝对定位
2006/11/26 Javascript
基于jquery的一个图片hover的插件
2010/04/24 Javascript
精通Javascript系列之数值计算
2011/06/07 Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
2013/07/17 Javascript
JavaScript清空数组元素的两种方法简单比较
2015/07/10 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
2015/09/06 Javascript
jQuery EasyUI之DataGrid使用实例详解
2016/01/04 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
2016/05/03 Javascript
URL的参数中有加号传值变为空格的问题(URL特殊字符)
2016/11/04 Javascript
详解用node.js实现简单的反向代理
2017/06/26 Javascript
Vue中如何实现轮播图的示例代码
2017/07/27 Javascript
jQuery中可见性过滤器简单用法示例
2018/03/31 jQuery
基于rollup的组件库打包体积优化小结
2018/06/18 Javascript
Bootstrap 按钮样式与使用代码详解
2018/12/09 Javascript
浅谈layer弹出层按钮颜色修改方法
2019/09/11 Javascript
js实现select下拉框选择
2020/01/11 Javascript
JS实现简单打字测试
2020/06/24 Javascript
vue 使用async写数字动态加载效果案例
2020/07/18 Javascript
JavaScript 绘制饼图的示例
2021/02/19 Javascript
[28:42]Ti4正赛VG vs NEWBEE1
2014/07/19 DOTA
Python根据区号生成手机号码的方法
2015/07/08 Python
Python实现监控Nginx配置文件的不同并发送邮件报警功能示例
2019/02/26 Python
Python绘制频率分布直方图的示例
2019/07/08 Python
使用Python实现文字转语音并生成wav文件的例子
2019/08/08 Python
在PyTorch中Tensor的查找和筛选例子
2019/08/18 Python
python 实现兔子生兔子示例
2019/11/21 Python
基于python+selenium自动健康打卡的实现代码
2021/01/13 Python
html5调用摄像头功能的实现代码
2018/05/07 HTML / CSS
北美领先的牛仔品牌:Buffalo David Bitton
2017/05/22 全球购物
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
澳大利亚家居用品零售商:Harris Scarfe
2020/10/10 全球购物