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 相关文章推荐
JavaScript中Object和Function的关系小结
Sep 26 Javascript
Javascript 面向对象编程(一) 封装
Aug 28 Javascript
js+html5绘制图片到canvas的方法
Jun 05 Javascript
js实现的彩色方块飞舞奇幻效果
Jan 27 Javascript
基于jQuery Easyui实现登陆框界面
Jul 10 jQuery
AngularJS select设置默认值的实现方法
Aug 25 Javascript
原生js实现仿window10系统日历效果的实例
Oct 31 Javascript
详解VUE 对element-ui中的ElTableColumn扩展
Mar 28 Javascript
Vue加载组件、动态加载组件的几种方式
Aug 31 Javascript
在Create React App中使用CSS Modules的方法示例
Jan 15 Javascript
微信小程序封装多张图片上传api代码实例
Dec 30 Javascript
在js文件中引入(调用)另一个js文件的三种方法
Sep 11 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 Smarty模板生成html文档的方法
2010/04/12 PHP
Php获取金书网的书名的实现代码
2010/06/11 PHP
PHP中使用mktime获取时间戳的一个黑色幽默分析
2012/05/31 PHP
php中mkdir函数用法实例分析
2014/11/15 PHP
Linux安装配置php环境的方法
2016/01/14 PHP
详解php几行代码实现CSV格式文件输出
2017/07/01 PHP
php封装单文件上传到数据库(路径)
2017/10/15 PHP
用js查找法实现当前栏目的高亮显示的代码
2007/11/24 Javascript
Js动态添加复选框Checkbox的实例方法
2013/04/08 Javascript
JavaScript通过RegExp实现客户端验证处理程序
2013/05/07 Javascript
SeaJS入门教程系列之使用SeaJS(二)
2014/03/03 Javascript
jQuery对JSON数据进行排序输出的方法
2015/06/24 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
2016/11/20 Javascript
BootStrap 实现各种样式的进度条效果
2016/12/07 Javascript
Vue 表单控件绑定的实现示例
2017/08/11 Javascript
webpack中CommonsChunkPlugin详细教程(小结)
2017/11/09 Javascript
实例讲解javascript实现异步图片上传方法
2017/12/05 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
[01:48]2018DOTA2亚洲邀请赛主赛事第二日五佳镜头 VG完美团战逆转TNC
2018/04/05 DOTA
python单例模式实例分析
2015/04/08 Python
Python中设置变量访问权限的方法
2015/04/27 Python
python 根据pid杀死相应进程的方法
2017/01/16 Python
Python selenium实现微博自动登录的示例代码
2018/05/16 Python
pytorch permute维度转换方法
2018/12/14 Python
Python 解决OPEN读文件报错 ,路径以及r的问题
2019/12/19 Python
Python requests模块cookie实例解析
2020/04/14 Python
使用Keras预训练模型ResNet50进行图像分类方式
2020/05/23 Python
SpringBoot首页设置解析(推荐)
2021/02/11 Python
DBA数据库管理员JAVA程序员架构师必看
2016/02/07 面试题
历史系自荐信范文
2013/12/24 职场文书
法人委托书范本格式
2014/09/15 职场文书
工商管理专业毕业生自我鉴定2014
2014/10/04 职场文书
产品质量保证书范本
2015/02/27 职场文书
2015关于重阳节的演讲稿
2015/03/20 职场文书
军训新闻稿范文
2015/07/17 职场文书
领导离职感言
2015/08/03 职场文书