代码改变世界

javascript运行机制

2012-11-23 11:51  cczw  阅读(1083)  评论(2编辑  收藏  举报

很多人对javascript的加载运行机制懵懵懂懂,包括我也是。所以整理出来备忘:

一 先热热身,看看下面两段代码:

//example 1

alert(a);
a=1000;
//example 2
alert(b);
var b=1000;
//example 3
func();
var func=function(){};

这三个会咋样呢?第一个会直接报错,代码终止执行当前代码块,跳入下一个代码块开始执行;第二个呢会弹出undefined,第三个会直接报错func不是一个函数。为什么会有这样的差异呢?这就跟今天的主题有关系了,它们分别涉及到了javascript的两个运行阶段,预解析运行阶段

二 预热结束,我们先系统的来了解一下javascript的运行过程,如下:

  1 上到下依次读入一个代码块(一个script标签)

  2 对该代码块进行语法分析,检查到语法错误则报错并终止该代码块运行,直接跳到下一个代码块运行。

  3 对代码块进行预解析,所有的var变量初始化为undefined,所有的function 预定义。(该步骤不会报错)

  4 逐行运行代码,有错则报错,并终止该代码块运行,跳到下一个代码块

  5 完事,进入下一个代码块的执行

三 仔细想想, 大概就可以解释上面的问题了。下面我们一一来解释:

  第一个例子的错误出在第4步,因为代码没有语法错误,经过第2步预解析时虚拟机也没有发现a变量的定义(var),所以a压根没有定义,所以到第四步运行的时候就出现错误了,a变量未定义。

  第二个例子其实不是报错,只是经过预解析后的a变量被赋值为undefined,运行到alert(a)的时候,依然没有被赋值,所以就只有弹出undefined了。

  第三个有点意思,因为在预解析的时候,func被解释成了一个var变量,所以他的初始值是undefined,运行到func()的时候 func依然是undefined,还没有被定义成函数,所以程序就出现错误提示,func is not a function。

举了这么几个例子大家应该对JavaScript的运行机制有所了解了吧。收笔。