浏览器是怎样解析JS的

浏览器运行整个页面文档时（html文件），遇到<script>标签，立刻唤醒JavaScript解析器来解析js代码。

 

JavaScript解析器工作步骤：

1、预解析阶段

这个阶段，JS解析器从上到下搜索代码，只去寻找一些关键字如var，function这些内容，找到这些内容后，相关的所有的变量都会被先赋值为undefined（这也就是变量提升为啥值会是undefined的具体原因），所有的函数变量都为函数块。

 

如果这个阶段遇到变量重名的问题，有以下规则：

变量和函数声明重名了，只留下函数；

函数和函数重名了，根据代码的上下文顺序，留下最后一个。

 

2、逐行解读代码。

这个阶段的变量赋值表达式可以修改上一步预解析的值。

如果有多个表达式对相同的变量多次赋值，那么除过函数声明不能修改上次的赋值，变量赋值和函数表达式都可以修改这个变量的值。

比如

alert(a);         //function a(){alert(1)}

var a = 0;

alert(a);         //0

var a = 1;

alert(a);         //1

var a = function(){

alert(0);

}

alert(a);         //function(){alert(0)};

function a(){alert(1)}//因为是函数声明，不会改变a的值

alert(a);         //function(){alert(0);}

 

在预解析阶段，a预解析的顺序为undefined(var)->undefined(var)->undefined(var )->function(){alert(1)};(function);

所以才有上面的运行结果。