javascript脚本从载入浏览器到显示执行的过程解析
来源:互联网 发布:ug轮廓3d倒角编程技巧 编辑:程序博客网 时间:2024/04/30 10:35
简单的代码:
<script type="text/javascript" src="xxx.js"></script> <script type="text/javascript"> var i = 10; function say(msg){ alert(msg); } </script> <script type="text/javascript"> j=100; say("hello world"); </script>
上面代码段的运行顺序是:
step1. 读入第一个代码段
step2. 做语法分析,有错则报语法错误(比如括号不匹配等),并跳转到step5
step3. 创建(全局/函数)执行环境,变量对象创建和实例化、作用域分配,对var变量和function定义做”预解析”,属于声明阶段
step4. 执行代码段(调用函数、进入eval时,都会创建新的执行环境),有错则报错(比如变量未定义)
step5. 如果还有下一个代码段,则读入下一个代码段,重复step2
step6. 结束
补充解释:
1、对于step1中的’代码段’指的是<script>... ...</script>
标签中的内容,还包括外部引入的脚本文件,如<script src="xxx.js"></script>
也被列是代码段的范畴。[每个<script>
标签都提供一个被编译的且立即执行的编译单元,因为缺少链接器,javascript把它们一起抛入一个公共的全局名字空间中。–《javascript语言精粹》]
2、对于step3创建全局执行环境,并不是每一个代码段都要执行step3,实际上,一个页面只会创建一个全局执行环境,所以从step2重复,不包括step3。
3、对于step3,变量声明和函数声明都被提升到当前作用域的顶端,’预解析’过程中,所有变量被赋值为undefined值,函数被赋值为函数定义的字符串,并不会对函数体中的JS代码做特殊处理,只是将函数体JS代码的扫描结果保存在函数对象的内部属性上,在函数执行时再做进一步处理。
例如:弹出结果并不是处理计算后的值,而是a函数的定义的字符串
<script type="text/javascript"> function a(){ var b =1; var c= 2; var d = b+c; alert(b+c); } alert(a); </script>
4、对于step3,创建函数执行环境,也就是创建函数的变量对象(活动对象),声明变量和函数,是在函数被调用时进行的,函数内部定义的变量和函数都保存在改变量对象中。
例如:
<script type="text/javascript"> function test(){ //未用var声明,a属于全局变量,如果未调用test就完成了声明,则全局环境可以访问到a变量 a = 2; } //alert(a);//Uncaught ReferenceError: a is not defined //alert(window.a);//undefined,并不能说明全局变量中已经声明了a变量,[如果你尝试检索一个并不存在的成员元素的值,将返回一个undefined值。--《javascript语言精粹》] test(); alert(a);//调用之后,则可以访问a变量 </script>
总结过程:下载、读入、语法分析、代码解析、执行
参考来源:http://www.cnblogs.com/fool/archive/2010/10/16/1853326.html
- javascript脚本从载入浏览器到显示执行的过程解析
- 从输入URL到浏览器显示页面的详细过程
- url从加载到浏览器显示的过程
- 从浏览器输入网址到页面显示之间的过程
- 从浏览器中输入url地址到浏览器中显示网页内容 的过程分析
- 浏览器从下载文档到显示页面的过程是个复杂的过程
- 浏览器中javascript的执行过程
- 浏览器中javascript的执行过程
- 浏览器中javascript的执行过程
- 浏览器中javascript的执行过程
- 浏览器中javascript的执行过程
- 浏览器中javascript的执行过程
- 浏览器从输入URL地址到最终显示内容的过程
- 初识JavaScript的解析与执行过程
- jenkins执行webdrive脚本时,不显示运行的浏览器
- 域名:从注册到解析的过程
- javascript的加载、解析、执行对浏览器渲染的影响
- 工作积累之浏览器中javascript的执行过程
- HDU 1242 Rescue
- 【Android 进阶(一)】Android MVP框架实现过程
- 单调队列 hdu3401 Trade
- R语言--tapply,sapply(因子和列表的操作)
- IOS中5种传值方式详解(属性、Block代码块、代理、单例、通知)
- javascript脚本从载入浏览器到显示执行的过程解析
- HDU 1048 字符串转化(整行读取函数cin.getline(str,100))
- Python yield 使用浅析
- CocoaPods入门 --小白篇
- CSS动画之硬件加速
- spring-session源码解读-4
- 理解RESTful架构
- 剑指offer:丑数
- 创建数据库的注解处理器_demo