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 私有成员分析
Jan 13 Javascript
用示例说明filter()与find()的用法以及children()与find()的区别分析
Apr 26 Javascript
jquery中获取id值方法小结
Sep 22 Javascript
js中的scroll和offset 使用比较的实例与分析
Sep 29 Javascript
javascript使用定时函数实现跳转到某个页面
Dec 25 Javascript
jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
Jan 24 Javascript
基于OL2实现百度地图ABCD marker的效果
Oct 01 Javascript
如何在Angular2中使用jQuery及其插件的方法
Feb 09 Javascript
基于vue2.0的活动倒计时组件countdown(附源码下载)
Oct 09 Javascript
js实现移动端吸顶效果
Jan 08 Javascript
vue 路由守卫(导航守卫)及其具体使用
Feb 25 Javascript
彻底搞懂并解决vue-cli4中图片显示的问题实现
Aug 31 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/12/19 PHP
正确的PHP匹配UTF-8中文的正则表达式
2015/05/13 PHP
javascript中的一些注意事项 更新中
2010/12/06 Javascript
js如何获取兄弟、父类等节点
2014/01/06 Javascript
js中使用replace方法完成某个字符的转换
2014/08/20 Javascript
jQuery实现当前页面标签高亮显示的方法
2015/03/10 Javascript
JQuery中属性过滤选择器用法实例分析
2015/05/18 Javascript
Jqgrid之强大的表格插件应用
2015/12/02 Javascript
基于Angularjs实现分页功能
2016/05/30 Javascript
AngularJS入门教程之ng-class 指令用法
2016/08/01 Javascript
JavaScript prototype属性详解
2016/10/25 Javascript
详解使用vue脚手架工具搭建vue-webpack项目
2017/05/10 Javascript
Angularjs为ng-click事件传递参数
2017/06/15 Javascript
js图片轮播插件的封装
2017/07/21 Javascript
jQuery实现基本隐藏与显示效果的方法详解
2018/09/05 jQuery
vue插件实现v-model功能
2018/09/10 Javascript
JS实现瀑布流效果
2020/03/07 Javascript
javascript开发实现贪吃蛇游戏
2020/07/31 Javascript
Antd下拉选择,自动匹配功能的实现
2020/10/24 Javascript
python中__slots__用法实例
2015/06/04 Python
Tensorflow分类器项目自定义数据读入的实现
2019/02/05 Python
Python 输出详细的异常信息(traceback)方式
2020/04/08 Python
Python while true实现爬虫定时任务
2020/06/08 Python
如何理解python对象
2020/06/21 Python
Python中全局变量和局部变量的理解与区别
2021/02/07 Python
使用CSS3滤镜的filter:blur属性制作毛玻璃模糊效果的方法
2016/07/08 HTML / CSS
IWOOT美国:新奇的小玩意
2018/04/27 全球购物
哈利波特商店:Harry Potter Shop
2018/11/30 全球购物
英国最大的天然和有机产品在线零售商之一:Big Green Smile
2020/05/06 全球购物
早晨薰衣草在线女性精品店:Morning Lavender
2021/01/04 全球购物
物理教学随笔感言
2014/02/22 职场文书
八一建军节感言
2014/02/28 职场文书
建议书标准格式
2014/03/12 职场文书
化学专业自荐信
2014/05/28 职场文书
2014年纪检部工作总结
2014/11/12 职场文书
2015团员个人年度总结
2015/11/24 职场文书