Javascript 变量作用域 两个可能会被忽略的小特性


Posted in Javascript onMarch 23, 2010

也许有些高手早已知道了,但是我觉得这两个东西还是有一些价值的,所以拿到这里和大家分享一下吧
. 有如下代码:

<script type="text/javascript" > 
function test() { 
with (location) { 
var temp = "an url"; 
} 
alert(temp); 
} 
test(); 
</script>

    调用这个函数会输出什么呢? 也许会认为它会弹出undefined, 但实际上,它弹出的是"an url"这个字符串,这就涉及到JavaScript中变量作用域的一个概念。
JS中,每个作用域都有一个相应的"变量对象"(这么叫不一定准确,知道有这么个东西就行了),这里面存放着当前作用域定义的标识符。JS程序开始的时候,会进入全局作用域, 在我们的程序中,因为全局作用域中定义了test函数,所以它这里的“变量对象”就存放了test函数的标识符。接下来,我们调用了test函数,就进入了,test函数的作用域,test函数本身的作用域也有自己的"变量对象",进入test的作用域的时候,也会把全局作用域里存放的标识符复制进来,所以,在test函数中就可以访问全局作用域中定义的标识符了,但是在外层作用域,是不能看到内层的内容的。如果这样的话,那我们这里的alert(temp)就会输出undefined,因为temp是在内层作用域定义的。但是为什么在这里却能够找到在内层作用域里定义的标识符呢?
    因为with语句块中作用域的"变量对象" 是只读的,所以在他本层定义的标识符,不能存储到本层,而是存储到它的上一层作用域,也就是test函数的作用域,所以,我们的alert(temp)这条语句,就可以访问到那个在内层定义的temp变量了。同样的情形还出现在try catch 语句里面。
.Javascript中没有语句块的概念,代码如下:
if (true) { 
var temp = "oh"; 
} 
alert(temp);

    很简单的几行代码,如果是按照通常的程序语言经验,我们会认为alert语句会报错,然而事实并不是这样,alert语句正常的输出了“oh” 这个字符串,所以在
Javascript中不存在语句块的概念。
    上面两个示例都很简单,也许并不是多高的技术,很多高手应该早已了解,但是这两个语言特性应该还是比较有用的,也许了解这些特性后,在写JS的时候会减少一些出错的机会,所以还是发上来和大家分享一下,希望能够对大家写JS的时候帮助。
Javascript 相关文章推荐
IE和Firefox下javascript的兼容写法小结
Dec 10 Javascript
jQuery实现的图文高亮滚动切换特效实例
Aug 10 Javascript
利用JQuery写一个简单的异步分页插件
Mar 07 Javascript
JavaScript中两个字符串的匹配
Jun 08 Javascript
js从外部获取图片的实现方法
Aug 05 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 Javascript
AngularJS实现用户登录状态判断的方法(Model添加拦截过滤器,路由增加限制)
Dec 12 Javascript
bootstrap suggest下拉框使用详解
Apr 10 Javascript
Angular 4.x 动态创建表单实例
Apr 25 Javascript
react-native ListView下拉刷新上拉加载实现代码
Aug 03 Javascript
Vue实现typeahead组件功能(非常靠谱)
Aug 26 Javascript
jQuery轮播图实例详解
Aug 15 jQuery
JavaScript Perfection kill 测试及答案
Mar 23 #Javascript
锋利的jQuery 第三章章节总结的例子
Mar 23 #Javascript
jQuery 核心函数以及jQuery对象
Mar 23 #Javascript
jquery easyui的tabs使用时的问题
Mar 23 #Javascript
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 #Javascript
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 #Javascript
锋利的jQuery 要点归纳(二) jQuery中的DOM操作(下)
Mar 23 #Javascript
You might like
PHP+javascript液晶时钟
2006/10/09 PHP
PHP 将图片按创建时间进行分类存储的实现代码
2010/01/05 PHP
php遍历文件夹所有文件子文件夹函数代码
2013/11/27 PHP
discuz加密解密函数使用方法和中文注释
2014/01/21 PHP
Codeigniter中禁止A Database Error Occurred错误提示的方法
2014/06/12 PHP
深入分析PHP引用(&amp;)
2014/09/04 PHP
YII Framework框架教程之安全方案详解
2016/03/14 PHP
PHP实现简单计算器小程序
2020/08/28 PHP
one.php 多项目、函数库、类库 统一为一个版本的方法
2020/08/24 PHP
学习jquery必备 api中英文对照的chm手册 下载
2007/05/03 Javascript
javascript 处理事件绑定的一些兼容写法
2009/12/24 Javascript
JS setCapture 区域外事件捕捉
2010/03/18 Javascript
下拉框select的绑定示例
2014/09/04 Javascript
JS实现的网页倒计时数字时钟效果
2015/03/02 Javascript
jQuery层级选择器_动力节点节点Java学院整理
2017/07/04 jQuery
vue 怎么创建组件及组件使用方法
2017/07/27 Javascript
Angular4 ElementRef的应用
2018/02/26 Javascript
解决vue处理axios post请求传参的问题
2018/03/05 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
自定义javascript验证框架示例【附源码下载】
2019/05/31 Javascript
vue中实现上传文件给后台实例详解
2019/08/22 Javascript
详解vue-flickity的fullScreen功能实现
2020/04/07 Javascript
使用React-Router实现前端路由鉴权的示例代码
2020/07/26 Javascript
JQuery基于FormData异步提交数据文件
2020/09/01 jQuery
vue实现简单加法计算器
2020/10/22 Javascript
Handtrack.js库实现实时监测手部运动(推荐)
2021/02/08 Javascript
Python 'takes exactly 1 argument (2 given)' Python error
2016/12/13 Python
Python3 列表,数组,矩阵的相互转换的方法示例
2019/08/05 Python
基于Python爬取fofa网页端数据过程解析
2020/07/13 Python
Python3利用openpyxl读写Excel文件的方法实例
2021/02/03 Python
css3实现的下拉菜单效果示例
2014/01/22 HTML / CSS
游戏商店:Eneba
2020/04/25 全球购物
什么是java序列化,如何实现java序列化
2012/11/14 面试题
保护黄河倡议书
2014/05/16 职场文书
公司年底活动方案
2014/08/17 职场文书
JavaScript实现一键复制内容剪贴板
2022/07/23 Javascript