JavaScript的作用域和块级作用域概念理解


Posted in Javascript onSeptember 21, 2014

作用域永远都是任何一门编程语言中的重中之重,因为它控制着变量与参数的可见性与生命周期。讲到这里,首先理解两个概念:块级作用域与函数作用域。

什么是块级作用域呢?

任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。

函数作用域就好理解了(*^__^*) ,定义在函数中的参数和变量在函数外部是不可见的。

大多数类C语言都拥有块级作用域,JS却没有。请看下文demo:

//C语言 
#include <stdio.h> 
void main() 
{ 
int i=2; 
i--; 
if(i) 
{ 
int j=3; 
} 
printf("%d/n",j); 
}

运行这段代码,会出现“use an undefined variable:j”的错误。可以看到,C语言拥有块级作用域,因为j是在if的语句块中定义的,因此,它在块外是无法访问的。

而JS是如何表现的呢,再看另一个demo:

functin test(){ 
for(var i=0;i<3;i++){ 
} 
alert(i); 
} 
test();

运行这段代码,弹出"3",可见,在块外,块中定义的变量i仍然是可以访问的。也就是说,JS并不支持块级作用域,它只支持函数作用域,而且在一个函数中的任何位置定义的变量在该函数中的任何地方都是可见的。

那么我们该如何使JS拥有块级作用域呢?是否还记得,在一个函数中定义的变量,当这个函数调用完后,变量会被销毁,我们是否可以用这个特性来模拟出JS的块级作用域呢?看下面这个DEMO:

function test(){ 
(function (){ 
for(var i=0;i<4;i++){ 
} 
})(); 
alert(i); 
} 
test();

这时候再次运行,会弹出"i"未定义的错误,哈哈,实现了吧~~~这里,我们把for语句块放到了一个闭包之中,然后调用这个函数,当函数调用完毕,变量i自动销毁,因此,我们在块外便无法访问了。

JS的闭包特性is the most important feature((*^__^*) 大家懂的)。在JS中,为了防止命名冲突,我们应该尽量避免使用全局变量和全局函数。那么,该如何避免呢?不错,正如上文demo所示,我们可以把要定义的所有内容放入到一个

(function (){ 
//内容 
})();

之中,这时候,我们是不是相当于给它们的外层添加了一个函数作用域呢?该作用域之外的程序是无法访问它们的。

Javascript 相关文章推荐
Asp.net下利用Jquery Ajax实现用户注册检测(验证用户名是否存)
Sep 12 Javascript
js操作滚动条事件实例
Jan 29 Javascript
JavaScript操作Oracle数据库示例
Mar 06 Javascript
jQuery+css3实现文字跟随鼠标的上下抖动
Jul 31 Javascript
JS+CSS实现下拉列表框美化效果(3款)
Aug 15 Javascript
JavaScript对象学习小结
Sep 02 Javascript
jQuery插件Timelinr 实现时间轴特效
Oct 04 Javascript
javascript replace()第二个参数为函数时的参数用法
Dec 26 Javascript
vue系列之动态路由详解【原创】
Sep 10 Javascript
关于自定义Egg.js的请求级别日志详解
Dec 12 Javascript
JavaScript学习笔记之DOM操作实例分析
Jan 08 Javascript
JavaScript高级程序设计之基本引用类型
Nov 17 Javascript
JavaScript中双叹号!!作用示例介绍
Sep 21 #Javascript
原生JavaScript实现合并多个数组示例
Sep 21 #Javascript
仿淘宝TAB切换搜索框搜索切换的相关内容
Sep 21 #Javascript
将数字转换成大写的人民币表达式的js函数
Sep 21 #Javascript
判断window.onload是否多次使用的方法
Sep 21 #Javascript
使用JavaScript进行进制转换将字符串转换为十进制
Sep 21 #Javascript
JS实现清除指定cookies的方法
Sep 20 #Javascript
You might like
php中文字母数字验证码实现代码
2008/04/25 PHP
浅谈web上存漏洞及原理分析、防范方法(文件名检测漏洞)
2013/06/29 PHP
PHP static局部静态变量和全局静态变量总结
2014/03/02 PHP
关于ThinkPhp 框架表单验证及ajax验证问题
2017/07/19 PHP
javascript getElementsByName()的用法说明
2009/07/31 Javascript
JQuery 动态扩展对象之另类视角
2010/05/25 Javascript
js 关于=+与+=日期函数使用说明(赋值运算符)
2011/11/15 Javascript
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
2012/08/14 Javascript
如何在父窗口中得知window.open()出的子窗口关闭事件
2013/10/15 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
2014/09/01 Javascript
JavaScript中的Web worker多线程API研究
2014/12/06 Javascript
js如何改变文章的字体大小
2016/01/08 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
基于Javascript实现返回顶部按钮
2016/02/29 Javascript
Vue.js快速入门实例教程
2016/10/15 Javascript
React Router基础使用
2017/01/17 Javascript
js实现3D图片环展示效果
2017/03/09 Javascript
Vue中fragment.js使用方法详解
2017/03/09 Javascript
微信小程序 连续旋转动画(this.animation.rotate)详解
2017/04/07 Javascript
13 个npm 快速开发技巧(推荐)
2019/07/04 Javascript
antd中table展开行默认展示,且不需要前边的加号操作
2020/11/02 Javascript
[01:40]2014DOTA2国际邀请赛 三冰SOLO赛后采访恶搞
2014/07/09 DOTA
用Python实现一个简单的能够发送带附件的邮件程序的教程
2015/04/08 Python
浅谈python对象数据的读写权限
2016/09/12 Python
Python玩转PDF的各种骚操作
2019/05/06 Python
django认证系统 Authentication使用详解
2019/07/22 Python
python cumsum函数的具体使用
2019/07/29 Python
Python使用re模块验证危险字符
2020/05/21 Python
Python基于pandas绘制散点图矩阵代码实例
2020/06/04 Python
Python压缩模块zipfile实现原理及用法解析
2020/08/14 Python
CSS3中HSL和HSLA的简单使用示例
2015/07/14 HTML / CSS
初中生三年学习生活的自我评价
2013/11/03 职场文书
教育学习自我评价
2014/02/03 职场文书
婚礼主持结束词
2014/03/13 职场文书
酒店管理专业毕业生自我鉴定
2014/09/29 职场文书
图书借阅制度范本
2015/08/06 职场文书