javascript脚本从载入浏览器到显示执行的过程解析
版权声明:本文为博主原创文章,未经博主允许不得转载。
简单的代码:
<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
最新文章
- ubuntu修改163软件源
- read name 和 read 在 Bash 中的区别
- Microsoft Azure News(3) Azure新的基本实例上线 (Basic Virtual Machine)
- Libevent 定时器
- css编写的时候注意什么
- [Java] 过滤文件夹
- php数组基础
- 常用aliyun公共资源列表
- 构件图(Component Diagram)—UML图(八)
- android:onKeyDown
- 如何在NodeJS项目中优雅的使用ES6
- Java学习笔记--异常描述
- myeclipse10破解失败,正解
- 巧妙地使用typora编辑有道云笔记
- 【转】web.xml中的contextConfigLocation在spring中的作用
- 树莓派 连接 JY901(MPU9250) python 代码
- 安装好visual studio后,如何添加新的工作负载和组件
- Go 实现异常处理机制
- 使用gdb调试theos tweak插件
- text-overflow:ellipsis ,溢出文本显示省略号
热门文章
- 27.AngularJS 下载地址
- 79.express里面的app.configure作用
- BZOJ 1066 Dinic
- Linux下大型容量件的切割与合并
- 【搭建Saltstack运维工具】
- CSDN博客给我带来的一些诱惑和选择机会(二):HR“邀请于我”,猎头“有求于我”
- Mysql学习总结(6)——MySql之ALTER命令用法详细解读
- Vim操作的四种模式
- 常用Linux命令 mount df dd
- Android应用公布后的统计——百度移动统计的应用