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动画浅析
Aug 30 Javascript
自制微信公众号一键排版工具
Sep 22 Javascript
详解AngularJS中的表单验证(推荐)
Nov 17 Javascript
JS高仿抛物线加入购物车特效实现代码
Feb 20 Javascript
简单实现js点击展开二级菜单功能
May 16 Javascript
React简单介绍
May 24 Javascript
浏览器调试动态js脚本的方法(图解)
Jan 19 Javascript
基于vue-cli npm run build之后vendor.js文件过大的解决方法
Sep 27 Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 Javascript
vue通过指令(directives)实现点击空白处收起下拉框
Dec 06 Javascript
redux.js详解及基本使用
May 24 Javascript
JS浮点数运算结果不精确的Bug解决
Aug 01 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
全国FM电台频率大全 - 28 甘肃省
2020/03/11 无线电
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
php懒人函数 自动添加数据
2011/06/28 PHP
PHP IF ELSE简化/三元一次式的使用
2011/08/22 PHP
Php中用PDO查询Mysql来避免SQL注入风险的方法
2013/04/25 PHP
解析使用ThinkPHP应该掌握的调试手段
2013/06/20 PHP
ThinkPHP使用心得分享-ThinkPHP + Ajax 实现2级联动下拉菜单
2014/05/15 PHP
简单的pgsql pdo php操作类实现代码
2016/08/25 PHP
iOS自定义提示弹出框实现类似UIAlertView的效果
2016/11/16 PHP
JS 判断undefined的实现代码
2009/11/26 Javascript
JavaScript高级程序设计 读书笔记之九 本地对象Array
2012/02/27 Javascript
DWZ刷新dialog解决方法
2013/03/03 Javascript
jQuery+.net实现浏览更多内容(改编php版本)
2013/03/28 Javascript
JS获取各种浏览器窗口大小的方法
2014/01/14 Javascript
jquery实现简易的移动端验证表单
2015/11/08 Javascript
微信小程序 开发指南详解
2016/09/27 Javascript
js实现表格筛选功能
2017/01/18 Javascript
为你的微信小程序体积瘦身详解
2017/05/20 Javascript
Vue使用高德地图搭建实时公交应用功能(地图 + 附近站点+线路详情 + 输入提示+换乘详情)
2018/05/16 Javascript
React中阻止事件冒泡的问题详析
2019/04/12 Javascript
vue 动态创建组件的两种方法
2020/12/31 Vue.js
Python常用正则表达式符号浅析
2014/08/13 Python
Python使用Paramiko模块编写脚本进行远程服务器操作
2016/05/05 Python
浅谈Django中view对数据库的调用方法
2019/07/18 Python
Python读取YAML文件过程详解
2019/12/30 Python
python_matplotlib改变横坐标和纵坐标上的刻度(ticks)方式
2020/05/16 Python
CSS3教程:边框属性border的极致应用
2009/04/02 HTML / CSS
百丽国际旗下购物网站:优购
2017/02/28 全球购物
中国京东和泰国中央集团合资的网站:JD CENTRAL
2020/08/22 全球购物
机电一体化毕业生自荐信
2014/06/19 职场文书
民主评议党员登记表自我评价
2014/10/20 职场文书
如何写好闭幕词
2019/04/02 职场文书
2019初中学生入团申请书
2019/06/27 职场文书
2019如何书写演讲稿?
2019/07/01 职场文书
导游词之潮音寺
2019/09/26 职场文书
go语言中GOPATH GOROOT的作用和设置方式
2021/05/05 Golang