- 浏览: 219553 次
- 性别:
- 来自: 广州
文章分类
最新评论
-
zzhyq:
有没有后台是ASHX 的呀
Ext.tree.TreePanel -
693593336:
谢谢作者分享,正好用上
Ext.tree.TreePanel -
greatwqs:
提供一个下载的demo不是更好
基于servlet的 Freemarker Demo
copy from :
http://www.blogjava.net/JAVA-HE/archive/2010/10/09/334021.html
这个话题看似简单,其实笔者是几次三番的下笔,又几次三番的放弃。因为这个内容,对于很多JavaScript的开发人员来讲都是一知半解的,当然笔者也在其中,今天之所以出来献丑了,首先是有了更深的认识,其次微博上有人说“献丑是进步”,如果献丑那必定是有同道之人能指出纰漏,那对于笔者本人来讲何尝不是进步呢?深表赞同!
今天会以几个小小的实例来解读这个课题。希望能与大家共勉。
首先得先了解JavaScript执行起来的流程,笔者先简单画了一个javascript的执行流程图:
重点解释的有三步:词法分析、预解析、执行。
script代码段:用script标签分隔的js代码或引入的js文件。
(1). 预解析
我们先从几个常见的javascript 小题目入手,请大家先看看下面的范例输出什么?
<script type="text/javascript">
alert(i); // ?
var i = 1;
</script>
对于javascript的从业者可以试着运行下。看看你的答案和实际输出一致吗?别小看这样两行脚本,这样的题目被当作JavaScript的笔试或者面试题目是常有的事情。
实际输出结果为:“undefined”,
这种现象被称成“预解析”:JavaScript脚本引擎优先解析var变量和function定义。在预解析完成后,才会执行代码。
由于变量i 是被 var声明的,而被优先解析。所以可以理解为在 alert(i) 执行时候,程序前面已经有 var i;
所以上面代码等效解释为:
<script type="text/javascript">
var i;
alert(i); // 对于被声明,但未赋值过的i,输出‘undefined’的结果,是不应该有任何歧义了吧。
i = 1;
</script>
注意:预解析不会报错,因为他只解析正确的声明。
(2). 解释(主要指词法分析,生成语法树的过程)
请注意,这里‘解释’的定义是笔者自己方便理解自己定义的,而这个‘解释’并不在预解析之后。
我们知道JavaScript是脚本语言,脚本语言是相对于高级编译型语言而言他是解释性的。解释性语言没有编译成二进制代码,但是要进入到运行阶段,都应该是会经过词法分析、语法分析生成语法树、语义检查过程,笔者把这个环节叫做“解释”,如果读者有更科学的名字记得告诉我。
解释性语言在生成语法树后,就可以执行了。(这个跟脚本引擎编译器有关)
在这个过程中,有语法检查(比如括号是否匹配),发现无法生成语法树,则报错,结束整个代码块的解析。
(3) 执行 与 作用域
引入我们的第二个示例代码:
<script type="text/javascript">
alert(i); // error: i is not defined.
i = 1;
</script>
听说JavaScript 变量可以直接用,那为什么还报运行时脚本错误?—— i 未定义.
执行过程,需要理解JavaScript的作用域机制,JavaScript变量的作用域是在定义时决定而不是执行时决定,也就是说词法作用域取决于源码,编译器通过静态分析就能确定,因此词法作用域也叫做静态作用域(static scope)。但需要注意,with和eval的语义无法仅通过静态技术实现,实际上,只能说JS的作用域机制非常接近lexical scope.
JS引擎在执行每个函数实例时,都会创建一个执行环境(execution context)。execution context中包含一个调用对象(call object), 调用对象是一个scriptObject结构,用来保存内部变量表varDecls、内嵌函数表funDecls、父级引用列表upvalue等语法分析结构(注意:varDecls和funDecls等信息是在预解析阶段就已经得到,并保存在语法树中。函数实例执行时,会将这些信息从语法树复制到scriptObject上)。scriptObject是与函数相关的一套静态系统,与函数实例的生命周期保持一致。
lexical scope是JS的作用域机制,还需要理解它的实现方法,这就是作用域链(scope chain)。scope chain是一个name lookup机制,首先在当前执行环境的scriptObject中寻找,没找到,则顺着upvalue到父级scriptObject中寻找,一直lookup到全局调用对象(global object)。
当一个函数实例执行时,会创建或关联到一个闭包(closure)。 scriptObject用来静态保存与函数相关的变量表,closure则在执行期动态保存这些变量表及其运行值。closure的生命周期有可能比函数实例长。函数实例在活动引用为空后会自动销毁,closure则要等要数据引用为空后,由JS引擎回收(有些情况下不会自动回收,就导致了内存泄漏)。
别被上面的一堆名词吓住,一旦理解了执行环境、调用对象、闭包、词法作用域、作用域链这些概念,JS语言的很多现象都能迎刃而解。
小结
“预解析”,其实是在的‘解释’阶段完成,并存储在语法树中。当执行到函数实例时,会将varDelcs和funcDecls从语法树中复制到执行环境的scriptObject上。
对于示例解析:
未定义变量意味着在scriptObject的变量表中找不到,JS引擎会沿着scriptObject的upvalue往上寻找,如果都没找到,对于写操作i = 1; 最后就会等价为 window.i = 1; 给window对象新增了一个属性。对于读操作,如果一直追溯到全局执行环境的scriptObject上都找不到,就会产生运行期错误。
最后,留个问题给大家:
<script type="text/javascript">
var arg = 1;
function foo(arg) {
alert(arg);
var arg = 2;
}
foo(3);
</script>
请问alert的输出是什么?
发表评论
-
JavaScript Core chapter 10
2011-07-18 11:20 842一些基础概念: #1 JavaScript 对象其实就是属 ... -
走马观花记二--css
2010-04-28 00:52 808css是Cascading Style Sheet(层叠样式 ... -
一个简单的Ajax登录例子
2010-06-27 10:12 9621.view(loginAjax.jsp) Code ... -
ajax的一些实例
2010-06-27 14:18 716两种引用方法: Code: //1 ... -
XHTML走马观花
2010-06-27 14:53 777其设计目的是为了实现从HTML到XML过渡,它结合了XML中部 ... -
CSS的一些实用例子
2010-06-27 15:35 708// 结合脚本语言动态的控制元素在页面中出现的位置。 ... -
DOM简介
2010-06-28 16:04 763全称是文档对象模型(Document Object Mode ... -
XML和XSTL走马观花(ajax)
2010-06-28 17:05 1230eXtensible Markup Language 的简称。 ... -
js中button事件的简单示例
2010-10-31 10:25 1145Code: <!DOCTYPEhtmlP ... -
一个简单的验证带验证提示例子
2010-11-05 23:47 813该例子的源码来源于《锋利的JQuery》这本书。Jquery ... -
网站开发必知基础(html)
2010-11-25 08:59 7961.div 定义和用法 <div> 可定义文档 ... -
Div+CSS布局入门教程
2010-12-07 23:40 723作为一个Web开发人员, ... -
jquery实例—json/xml数据格式交互
2011-04-07 10:08 988学习资料:jquery实例 来自:http://www.doc ... -
jquery版本对json数据格式接收的区别
2011-04-08 14:46 1392毕设中,做注册页面,选用jquery纯属玩玩而已的,也不知道j ... -
56个民族 下来框(常用的排序)
2011-04-08 17:12 1572<select name="select&qu ... -
js获取当前url的中文参数
2011-04-14 02:50 2844问题源自于大傻同学的需求:A.html的参数传给B.html ... -
毕设简单的登录界面
2011-04-14 11:08 1000Code: <htmlxmlns=&qu ...
相关推荐
java语言已经内置了多线程支持,所有实现Runnable接口的类都可被启动一个新线程,新线程会执行该实例的run()方法,当run()方法执行完毕后,线程就结束了。一旦一个线程执行完毕,这个实例就不能再重新启动,只能重新...
日志错误error_log.log 提示: suEXEC mechanism enabled 日志nss_error_log.log 提示: [Sun Nov 27 16:46:38 2016] [error]Certificate not verified: 'Server-Cert' [Sun Nov 27 16:46:38 2016] [error] SSL ...
本项目"tensorflow_attention_mechanism_master"专注于利用Attention机制实现seq2seq(Sequence-to-Sequence)模型,该模型在诸如机器翻译、对话系统、文本摘要等任务中表现优秀。 Attention机制是2015年提出的一种...
### Antikythera Mechanism:古代科技的奇迹与谜团 #### 一、引言 《Antikythera Mechanism1.pdf》是UCBerkeley(加州大学伯克利分校)一门课程的阅读材料,这门课程由Christos Papadimitriou教授开设,课程网址为...
### Antikythera Mechanism:解码古希腊天文计算器 #### 一、引言 Antikythera Mechanism是一台独特的古希腊齿轮装置,它大约在公元前2世纪末期制造而成。这一装置因其复杂的技术结构而备受关注,不仅在天文学计算...
### Antikythera Mechanism:古希腊的高科技遗产 #### 概述 《Antikythera Mechanism3.pdf》作为UCBerkeley一门课程的阅读资料,属于该系列的第三部分,它深入探讨了这一古希腊神秘装置的复杂性和精密性。...
注意力机制(Attention Mechanism)源于对人类视觉的研究,是人类信息处理过程中的一种重要机制。在认知科学中,由于信息处理的瓶颈,人类会选择性地关注所有信息的一部分,同时忽略其他可见的信息。这种机制可以...
这个机制在Intel的手册中被详细描述,尤其在“EPT Translation Mechanism”章节。以下是EPT转换机制的关键点: 1. **EPT层级结构**:EPT使用类似于Intel x86的四级页表结构,但只使用低47位(GPA的Bit 47:0)进行...
标题中提到的“Self-supervised Attention Mechanism for Pediatric Bone Age Assessment with Efficient Weak Annotation”所涉及的知识点主要包括以下几个方面: 1. 自监督学习(Self-supervised Learning):这...
A MECHANISM OF MANAGEMENT OF TRUST VALUE OF WEB SERVICE IN P2P ENVIRONMENT,杨静波,,Peer to Peer (P2P) systems become more and more popular and bring both opportunities and threats. In the issues of...
message-mechanism.md
2. **可重构缆驱并联机器人(Reconfigurable Cable-driven Parallel Mechanism, RCPM)**:为了减少碰撞风险,对传统的缆驱并联机器人进行了改进,发展出了可重构缆驱并联机器人。这种机器人通过手动安装或移除电缆...
### 滚珠丝杠机制的动力学研究 #### 引言与背景 滚珠丝杠是一种重要的力和运动传递装置,属于动力传动螺杆的一种。它以其出色的定位精度和负载能力而著称,在机器人手臂驱动机构或机床进给驱动机构等领域得到广泛...
Additional methods that when implemented make an ExpandableListAdapter take advantage of the Adapter view type mechanism.
if u wanna to study MMK, as i think, the main mechanism about message transport you need to get acknowledeg.please FYI.
Model-Driven Mechanism in Information Systems and Enterprise Engineering 暨大2007讲座中部分内容的英文版
在本资源"four_bar_mechanism.rar"中,包含了一个名为"four_bar_mechanism.m"的MATLAB程序,用于解决四杆机构的运动分析问题。MATLAB是一款强大的数学计算软件,其丰富的函数库和可视化工具使得四杆机构的复杂计算变...