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 相关文章推荐
javascript 放大镜 v1.0 基于Yui2 实现的放大镜效果
Mar 08 Javascript
javascript showModalDialog 内跳转页面的问题
Nov 25 Javascript
深入探寻seajs的模块化与加载方式
Apr 14 Javascript
jQuery 1.9.1源码分析系列(十五)动画处理之缓动动画核心Tween
Dec 03 Javascript
thinkphp实现无限分类(使用递归)
Dec 19 Javascript
浅谈angularjs module返回对象的坑(推荐)
Oct 21 Javascript
jQuery实现两列等高并自适应高度
Dec 22 Javascript
JavaScript仿支付宝6位数字密码输入框
Dec 29 Javascript
node使用UEditor富文本编辑器的方法实例
Jul 11 Javascript
微信小程序 五星评分的实现实例
Aug 04 Javascript
JavaScript中错误正确处理方式小结你用对了吗
Oct 10 Javascript
如何利用@angular/cli V6.0直接开发PWA应用详解
May 06 Javascript
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运行出现Notice : Use of undefined constant 的完美解决方案分享
2012/03/05 PHP
php循环语句 for()与foreach()用法区别介绍
2012/09/05 PHP
php判断对象是派生自哪个类的方法
2015/06/20 PHP
在PHP中使用FastCGI解析漏洞及修复方案
2015/11/10 PHP
浅谈PHP链表数据结构(单链表)
2016/06/08 PHP
addRule在firefox下的兼容写法
2006/11/30 Javascript
JavaScript 对象链式操作测试代码
2010/04/25 Javascript
限制textbox或textarea输入字符长度的JS代码
2013/10/16 Javascript
angularjs基础教程
2014/12/25 Javascript
js判断鼠标左、中、右键哪个被点击的方法
2015/01/27 Javascript
jQuery和hwSlider实现内容响应式可触控滑动切换效果附源码下载(二)
2016/06/22 Javascript
Vue.js学习笔记之 helloworld
2016/08/14 Javascript
js实现表单提交后不重新刷新当前页面
2016/11/30 Javascript
JS使用正则截取两个字符串之间的字符串实现方法详解
2017/01/06 Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
2020/03/28 Javascript
Vue2.0 实现歌手列表滚动及右侧快速入口功能
2018/08/08 Javascript
package.json配置文件构成详解
2019/08/27 Javascript
如何基于js判断浏览器版本
2020/02/20 Javascript
Python内置的字符串处理函数整理
2013/01/29 Python
Python脚本实现格式化css文件
2015/04/08 Python
利用Python中的输入和输出功能进行读取和写入的教程
2015/04/14 Python
python和ruby,我选谁?
2017/09/13 Python
Python中import机制详解
2017/11/14 Python
Python3常见函数range()用法详解
2019/12/30 Python
python重要函数eval多种用法解析
2020/01/14 Python
python实现拼接图片
2020/03/23 Python
pycharm实现print输出保存到txt文件
2020/06/01 Python
tensorflow2.0教程之Keras快速入门
2021/02/20 Python
css3实现波纹特效、H5实现动态波浪效果
2018/01/31 HTML / CSS
css 元素选择器的简单实例
2016/05/23 HTML / CSS
Html5调用手机摄像头并实现人脸识别的实现
2018/12/21 HTML / CSS
施华洛世奇美国官网:SWAROVSKI美国
2018/02/08 全球购物
2014年党务公开实施方案
2014/02/27 职场文书
银行授权委托书范本
2014/10/04 职场文书
何玥事迹观后感
2015/06/16 职场文书
mysql使用 not int 子查询隐含陷阱
2022/04/12 MySQL