JS运行机制

如果一个文档流中包含多个script代码段（用script标签分隔的js代码或引入的js文件），运行顺序是： 

step1. 读入第一个代码段，JavaScript执行引擎并非一行一行地执行程序，而是一段一段地分析执行的（以<\script\>标签来分割） 

step2. 做语法分析，有错则报语法错误（比如括号不匹配等），并跳转到step5 

step3. 对var变量做声明（初始为undefined）和function定义做“预解析”（永远不会报错的，因为只解析正确的声明） 

step4. 执行代码段，有错则报错（比如变量未定义） 

step5. 如果还有下一个代码段，则读入下一个代码段，重复step2 

step6. 结束 

 

JS的编译过程：

众所周知，javascript是解释型语言，它不同于c#和java等编译型语言。对于传统编译型语言来说，编译步骤分为：词法分析、语法分析、语义检查、代码优化和字节生成；但对于解释型语言来说，通过词法分析和语法分析得到语法树后，就可以开始解释执行了。

例子：

alert(testNum);
alert('ok');
testNum = 2;
//testNum未声明，执行报错。

alert(testNum);
alert('ok');
var testNum = 2;
//弹出undefined和ok。预编译的时候，声明了变量t；执行到alert(t)这行代码的时候，t尚未被赋值，所以弹出undefined。

testFunc();
function testFunc() {}
alert('ok');
//弹出ok。预编译的时候，解析了定义式函数语句function testFunc() {}，顺利执行。

testFunc();
var testFunc = function() {};
alert('ok');
//testFunc不是函数，执行报错。预编译的时候，声明了变量testFunc = undefined；执行到testFunc()时，testFunc还等于undefined，不是函数，所以执行testFunc()会报错。

 

<\script type="text/javascript">
    testFunc();
    alert('first block');
<!--\script-->
<\script type="text/javascript">
    alert('second block');
<!--\script-->
//弹出second block。因为JS是一段一段执行的，第一段执行到testFunc()的时候报错，整个第一段都不会再执行，第二段正常执行。