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 相关文章推荐
js自带函数备忘 数组
Dec 29 Javascript
学习JavaScript的最佳方法分享
Oct 21 Javascript
JS获取节点的兄弟,父级,子级元素的方法
Jan 09 Javascript
js中精确计算加法和减法示例
Mar 28 Javascript
JavaScript开发者必备的10个Sublime Text插件
Feb 27 Javascript
js动态添加的DIV中的onclick事件简单实例
Jul 25 Javascript
教你用十行node.js代码读取docx的文本
Mar 08 Javascript
js每隔两秒输出数组中的一项(实例)
May 28 Javascript
js中arguments对象的深入理解
May 14 Javascript
解决使用layui对select append元素无效或者未及时更新的问题
Sep 18 Javascript
JavaScript设计模式--简单工厂模式定义与应用案例详解
May 23 Javascript
Vue axios获取token临时令牌封装案例
Sep 11 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采集利器 Snoopy 试用心得
2011/07/03 PHP
php中计算中文字符串长度、截取中文字符串的函数代码
2011/08/09 PHP
深入php之规范编程命名小结
2013/05/15 PHP
PHP创建PowerPoint2007文档的方法
2015/12/10 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
javascript模块化是什么及其优缺点介绍
2013/09/02 Javascript
详解AngularJS Filter(过滤器)用法
2015/12/28 Javascript
ionic实现底部分享功能
2017/05/11 Javascript
详解如何使用webpack打包Vue工程
2017/05/27 Javascript
判断div滑动到底部的scroll实例代码
2017/11/15 Javascript
关于react-router/react-router-dom v4 history不能访问问题的解决
2018/01/08 Javascript
解决vue-router中的query动态传参问题
2018/03/20 Javascript
详解vue.js根据不同环境(正式、测试)打包到不同目录
2018/07/13 Javascript
vue获取form表单的值示例
2019/10/29 Javascript
解决Element中el-date-picker组件不回填的情况
2020/11/07 Javascript
[01:57]DOTA2上海特锦赛小组赛解说单车采访花絮
2016/02/27 DOTA
Python def函数的定义、使用及参数传递实现代码
2014/08/10 Python
Python语言描述机器学习之Logistic回归算法
2017/12/21 Python
python 解决动态的定义变量名,并给其赋值的方法(大数据处理)
2018/11/10 Python
python requests爬取高德地图数据的实例
2018/11/10 Python
在python中利用GDAL对tif文件进行读写的方法
2018/11/29 Python
Python中出现IndentationError:unindent does not match any outer indentation level错误的解决方法
2020/04/18 Python
解决python中用matplotlib画多幅图时出现图形部分重叠的问题
2019/07/07 Python
解决Python logging模块无法正常输出日志的问题
2020/02/21 Python
python计算导数并绘图的实例
2020/02/29 Python
Python 通过监听端口实现唯一脚本运行方式
2020/05/05 Python
python入门:argparse浅析 nargs='+'作用
2020/07/12 Python
荷兰超市:DEEN
2018/03/14 全球购物
德国自然时尚和有机产品购物网站:Waschbär
2019/05/29 全球购物
大学生个人求职口试自我评价
2014/02/16 职场文书
企业节能减排实施方案
2014/03/19 职场文书
亲子运动会的活动方案
2014/08/17 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
销售员未完成销售业绩的检讨书
2014/10/12 职场文书
少儿励志名言(80句)
2019/08/14 职场文书
Nginx速查手册及常见问题
2022/04/07 Servers