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 相关文章推荐
WEB 浏览器兼容 推荐收藏
May 14 Javascript
jquery获得option的值和对option进行操作
Dec 13 Javascript
js数组方法扩展实现数组统计函数
Apr 09 Javascript
基于Node.js实现nodemailer邮件发送
Jan 26 Javascript
JavaScript中的操作符类型转换示例总结
May 30 Javascript
浅谈JavaScript的内置对象和浏览器对象
Jun 03 Javascript
第一次接触Bootstrap框架
Oct 24 Javascript
vue中遇到的坑之变化检测问题(数组相关)
Oct 13 Javascript
vue cli webpack中使用sass的方法
Feb 24 Javascript
webpack4.x CommonJS模块化浅析
Nov 09 Javascript
基于Koa2写个脚手架模拟接口服务的方法
Nov 27 Javascript
Vue动态生成el-checkbox点击无法赋值的解决方法
Feb 21 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 XML error parsing SOAP payload on line 1
2010/06/17 PHP
PHP SESSION的增加、删除、修改、查看操作
2015/03/20 PHP
PHP数组操作类实例
2015/07/11 PHP
php简单实现多维数组排序的方法
2016/09/30 PHP
Redis在Laravel项目中的应用实例详解
2017/08/11 PHP
PHP7内核之Reference详解
2019/03/14 PHP
Laravel框架中队列和工作(Queues、Jobs)操作实例详解
2020/04/06 PHP
JavaScript是否可实现多线程  深入理解JavaScript定时机制
2009/12/22 Javascript
javascript让setInteval里的函数参数中的this指向特定的对象
2010/01/31 Javascript
javascript 窗口加载蒙板 内嵌网页内容
2010/11/19 Javascript
jQuery初学:find()方法及children方法的区别分析
2011/01/31 Javascript
Extjs实现进度条的两种便捷方式
2013/09/26 Javascript
jQuery控制TR显示隐藏的三种常用方法
2014/08/21 Javascript
原生javascript实现拖动元素示例代码
2014/09/01 Javascript
jQuery实现鼠标划过添加和删除class的方法
2015/06/26 Javascript
JQuery PHP图片在线裁剪实例
2020/07/27 Javascript
JS中使用mailto实现将用户在网页中输入的内容传递到本地邮件客户端
2016/10/08 Javascript
自学实现angularjs依赖注入
2016/12/20 Javascript
Bootstrap源码解读导航条(7)
2016/12/23 Javascript
angularjs实现table表格td单元格单击变输入框/可编辑状态示例
2019/02/21 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
2020/05/13 Javascript
vue 计算属性和侦听器的使用小结
2021/01/25 Vue.js
[54:24]Optic vs TNC 2018国际邀请赛小组赛BO2 第二场
2018/08/18 DOTA
[49:30]DOTA2-DPC中国联赛正赛 Dragon vs Dynasty BO3 第二场 3月4日
2021/03/11 DOTA
python基础教程之基本内置数据类型介绍
2014/02/20 Python
Python2.6版本中实现字典推导 PEP 274(Dict Comprehensions)
2015/04/28 Python
Python的math模块中的常用数学函数整理
2016/02/04 Python
python3实现暴力穷举博客园密码
2016/06/19 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
Python 删除整个文本中的空格,并实现按行显示
2018/07/24 Python
Python math库 ln(x)运算的实现及原理
2019/07/17 Python
python图像处理模块Pillow的学习详解
2019/10/09 Python
wxpython实现按钮切换界面的方法
2019/11/19 Python
Python 面向对象部分知识点小结
2020/03/09 Python
新大陆软件面试题
2016/11/24 面试题
Pyhton模块和包相关知识总结
2021/05/12 Python