js执行过程

时间：2017-01-04 12:40:26 阅读：215 评论：0 收藏：0 [点我收藏+]

正如我们了解的一样，当我们书写了JS程序之后，打开浏览器，我们的代码就可以开始运行了（当然保证你的代码没有问题，才能按照你的预期进行执行）。刚才说的是JS执行的一个大的环境，今天我们学习一下，JS在解析器里的一个执行过程。

这个过程分为两个阶段：

进入执行上下文
执行代码

变量对象的变化，和这两个阶段息息相关。

在介绍这两个阶段之前，了解相关的概念。

如果变量和执行上下文相关，那么它应该知道在哪里存储数据和怎么访问数据，这种机制叫做变量对象(variable object，简称VO)。用于存储下列数据：

变量声明
函数声明（这个地方需要和函数表达式作区分）
函数参数

第一个阶段：进入执行上下文。此时VO将会被下面的属性初始化（按照下面的顺序进行初始化）：

函数参数：VO的一个属性，这个属性是有形参名称和值组成，如果没有传递实参，那就是形参的名称和undefined。
函数声明：是由函数的名称和值组成，如果VO中存在该属性值，则替换这个属性。
变量声明：由变量名称和undefined组成，如果变量名和VO有的函数参数或函数声明相同，则变量声明不会干扰已存在属性。

VO的使用环境有：GlobalContext和FunctionContext。

来个例子：

function test(a, b) {
      var c = 20;
      function d(){}
      var e = function _e(){};
     (function x(){});
}
test(30);

当进入执行环境，VO如下：

VO (test FunctionContext) = {
       a: 30,
       b: undefined,
       d: <reference to FunctionDeclaration "d">,
       c: undeifined,
       e: undefined
   }

注：其中x 、_e都是函数表达式，_e通过变量声明e进行访问。

接下来就会进入下一个阶段，执行代码阶段：

以上面的例子来说，会经历下面的过程：

VO[‘c‘] = 20;
VO[‘e‘] = <reference to FunctionDeclaration "_e">;

这样代码就执行完了。

再来一个经典的例子：

alert(x); //function
var x = 10;
x = 20;
function x() {}
alert(x);    //20

为什么第一个是function，而不是undeofined或者是not defined或者10、20？因为，根据规范 — 当进入上下文时，往VO里填入函数声明；在相同的阶段，还有一个变量声明“x”，那么正如我们在上一个阶段所说，变量声明在顺序上跟在函数声明和形式参数声明之后，而且，在这个阶段，变量声明不会干扰VO中已经存在的同名函数声明或形式参数声明，因此，在进入上下文时，VO的结构如下：

VO = {}
VO[‘x‘] = <reference to FunctionDeclaration "x">;
VO[‘x‘] = <the value is not disturbed, still function>

在代码执行阶段：

V[‘x‘] = 10;
V[‘x‘] = 20;

了解了这个过程，我相信对JS执行过程会有一个全新的理解。

js执行过程

原文：http://www.cnblogs.com/ricoliu/p/6248043.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)