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 相关文章推荐
一些易混淆且不常用的属性,希望有用
Jan 29 Javascript
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
Oct 29 Javascript
11款基于Javascript的文件管理器
Oct 25 Javascript
jquery模拟alert的弹窗插件
Jul 31 Javascript
jQuery获取file控件中图片的宽高与大小
Aug 04 Javascript
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 jQuery
AngularJS模态框模板ngDialog的使用详解
May 11 Javascript
看看“疫苗查询”小程序有温度的代码
Jul 31 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
Nov 13 Javascript
基于js Canvas实现二次贝塞尔曲线
Dec 25 Javascript
如何使用50行javaScript代码实现简单版的call,apply,bind
Aug 14 Javascript
解决vue的过渡动画无法正常实现问题
Oct 31 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 压缩文件夹的类代码
2009/11/05 PHP
PHP5函数小全(分享)
2013/06/06 PHP
PHP使用ODBC连接数据库的方法
2015/07/18 PHP
高质量PHP代码的50个实用技巧必备(上)
2016/01/22 PHP
Zend Framework入门教程之Zend_Mail用法示例
2016/12/08 PHP
jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
2013/01/04 Javascript
JavaScript实现LI列表数据绑定的方法
2015/08/04 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
2015/09/12 Javascript
yarn与npm的命令行小结
2016/10/20 Javascript
Select2.js下拉框使用小结
2016/10/24 Javascript
超全面的vue.js使用总结
2017/02/12 Javascript
Cpage.js给组件绑定事件的实现代码
2017/08/31 Javascript
如何理解Vue的v-model指令的使用方法
2018/07/19 Javascript
微信小程序实现点击按钮后修改颜色
2019/12/05 Javascript
vue实现简单的登录弹出框
2020/10/26 Javascript
python中zip和unzip数据的方法
2015/05/27 Python
Python解析树及树的遍历
2016/02/03 Python
今天 平安夜 Python 送你一顶圣诞帽 @微信官方
2017/12/25 Python
PyCharm+PyQt5+QtDesigner配置详解
2020/08/12 Python
Python中pass的作用与使用教程
2020/11/13 Python
HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能
2018/04/23 HTML / CSS
HTML5自定义视频播放器源码
2020/01/06 HTML / CSS
Tirendo比利时:在线购买轮胎
2018/10/22 全球购物
捷克母婴用品购物网站:Feedo.cz
2020/12/28 全球购物
面向对象编程是如何提高软件开发水平的
2014/05/06 面试题
出纳岗位职责
2013/11/09 职场文书
文言文形式的学生求职信
2013/12/03 职场文书
房地产开发计划书
2014/01/10 职场文书
文艺演出策划方案
2014/06/07 职场文书
领导班子党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
总账会计岗位职责
2015/04/02 职场文书
2015年语文教学工作总结
2015/05/25 职场文书
TensorFlow中tf.batch_matmul()的用法
2021/06/02 Python
python百行代码实现汉服圈图片爬取
2021/11/23 Python
电脑只能进入安全模式无法正常启动的解决办法
2022/04/08 数码科技
Java实现HTML转为Word的示例代码
2022/06/28 Java/Android