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 相关文章推荐
根据邮箱的域名跳转到相应的登录页面的代码
Feb 27 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
May 15 Javascript
JavaScript获取/更改文本框的值的实例代码
Aug 02 Javascript
jQuery 判断图片是否加载完成方法汇总
Aug 10 Javascript
vue2.0数据双向绑定与表单bootstrap+vue组件
Feb 27 Javascript
webpack实现热更新(实施同步刷新)
Jul 28 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
Sep 15 Javascript
Bootstrap treeview实现动态加载数据并添加快捷搜索功能
Jan 07 Javascript
关于jquery中attr()和prop()方法的区别
May 28 jQuery
JavaScript实现JSON合并操作示例【递归深度合并】
Sep 07 Javascript
微信小程序bindtap事件与冒泡阻止详解
Aug 08 Javascript
微信小程序自定义底部弹出框动画
Nov 18 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使用curl实现ftp文件下载功能
2017/05/16 PHP
PHP通过文件路径获取文件名的实例代码
2018/10/14 PHP
laravel实现Auth认证,登录、注册后的页面回跳方法
2019/09/30 PHP
JS 创建对象(常见的几种方法)
2008/11/03 Javascript
jQuery层次选择器选择元素使用介绍
2013/04/18 Javascript
JS实现超过长度限制后自动跳转下一款文本框的方法
2015/02/23 Javascript
JavaScript实现的一个倒计时的类
2015/03/12 Javascript
Node.js编写爬虫的基本思路及抓取百度图片的实例分享
2016/03/12 Javascript
Ajax高级笔记 JavaScript高级程序设计笔记
2017/06/22 Javascript
js+html5实现复制文字按钮
2017/07/15 Javascript
js实现扫雷小程序的示例代码
2017/09/27 Javascript
elementui的默认样式修改方法
2018/02/23 Javascript
vue 国际化 vue-i18n 双语言 语言包
2018/06/07 Javascript
vue增加强缓存和版本号的实现方法
2019/05/01 Javascript
element-ui组件中input等的change事件中传递自定义参数
2019/05/22 Javascript
原生JavaScript之es6中Class的用法分析
2020/02/23 Javascript
JS轮播图的实现方法
2020/08/24 Javascript
k8s node节点重新加入master集群的实现
2021/02/22 Javascript
[01:33]完美世界DOTA2联赛PWL S3 集锦第二期
2020/12/21 DOTA
python操作ie登陆土豆网的方法
2015/05/09 Python
Python中map和列表推导效率比较实例分析
2015/06/17 Python
tensorflow创建变量以及根据名称查找变量
2018/03/10 Python
python读取视频流提取视频帧的两种方法
2020/10/22 Python
Python基础学习之基本数据结构详解【数字、字符串、列表、元组、集合、字典】
2019/06/18 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
通过案例解析python鸭子类型相关原理
2020/10/10 Python
全网最细 Python 格式化输出用法讲解(推荐)
2021/01/18 Python
YOOX台湾:意大利奢侈品电商
2018/10/13 全球购物
美国运动鞋类和服装零售连锁店:Shoe Palace
2019/08/13 全球购物
struct与class的区别
2014/02/03 面试题
自我鉴定书范文
2013/10/02 职场文书
面试后的感谢信范文
2014/02/01 职场文书
组织生活会表态发言材料
2014/10/17 职场文书
电工实训报告总结
2014/11/05 职场文书
2015年电话销售工作总结范文
2015/04/20 职场文书
JavaWeb Servlet实现网页登录功能
2021/07/04 Java/Android