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 网页跳转的方法
Dec 24 Javascript
基于KMP算法JavaScript的实现方法分析
May 03 Javascript
ScrollDown的基本操作示例
Jun 09 Javascript
JS实现字体选色板实例代码
Nov 20 Javascript
javascript模拟实现C# String.format函数功能代码
Nov 25 Javascript
javascript获取四位数字或者字母的随机数
Jan 09 Javascript
js使用DOM设置单选按钮、复选框及下拉菜单的方法
Jan 20 Javascript
JavaScript操作HTML元素和样式的方法详解
Oct 21 Javascript
纯JS焦点图特效实例(可一个页面多用)
Dec 07 Javascript
jQuery拖拽通过八个点改变div大小
Nov 29 Javascript
JS简单获取当前年月日星期的方法示例
Feb 07 Javascript
vue代码分块和懒加载非必要资源文件
Apr 11 Vue.js
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生成随机数的三种方法
2014/09/10 PHP
解析WordPress中的post_class与get_post_class函数
2016/01/04 PHP
Laravel 读取 config 下的数据方法
2019/10/13 PHP
豆瓣网的jquery代码实例
2008/06/15 Javascript
jquery 常用操作整理 基础入门篇
2009/10/14 Javascript
基于Unit PNG Fix.js有时候在ie6下不正常的解决办法
2013/06/26 Javascript
iScroll中事件点击触发两次解决方案
2015/03/11 Javascript
JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
2016/02/25 Javascript
全面解析多种Bootstrap图片轮播效果
2016/05/27 Javascript
利用JS实现数字增长
2016/07/28 Javascript
js实现String.Fomat的实例代码
2016/09/02 Javascript
BootStrap中的表单大全
2016/09/07 Javascript
利用React-router+Webpack快速构建react程序
2016/10/27 Javascript
js中通过getElementsByName访问name集合对象的方法
2016/10/31 Javascript
Vue导出json数据到Excel电子表格的示例
2017/12/04 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
2017/12/26 Javascript
javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】
2019/06/13 Javascript
简介JavaScript错误处理机制
2020/08/04 Javascript
Django在Win7下的安装及创建项目hello word简明教程
2014/07/14 Python
python访问类中docstring注释的实现方法
2015/05/04 Python
Sublime开发python程序的示例代码
2018/01/24 Python
Win10下python3.5和python2.7环境变量配置教程
2018/09/18 Python
Python如何使用PIL Image制作GIF图片
2020/05/16 Python
HTML5 Convas APIs方法详解
2015/04/24 HTML / CSS
中国旅游网站:同程旅游
2016/09/11 全球购物
Windows和Linux动态库应用异同
2016/07/28 面试题
编程输出如下图形
2013/11/24 面试题
外贸销售员求职的自我评价
2013/11/23 职场文书
师德师风建设方案
2014/05/08 职场文书
春节联欢会策划方案
2014/05/16 职场文书
商铺门前三包责任书
2014/07/25 职场文书
2014年党员干部四风问题自我剖析材料
2014/09/29 职场文书
小学生勤俭节约倡议书
2015/04/29 职场文书
Promise面试题详解之控制并发
2021/05/14 面试题
浅谈Python魔法方法
2021/06/28 Java/Android
Python内置类型集合set和frozenset的使用详解
2022/04/26 Python