JavaScript高级系列(三) - JavaScript的运行过程 一. 全局代码的执行过程1.1. ECMA的版本说明在ECMA早期的版本(ECMAScript3),代码的执行流程的术语和ECMAScript5以及之后的术语会有所区别:目前网上大多数流行的说法都是基于ECMAScript3版本的解析,并且在面试问到的大多数都是ECMAScript3的版本内容;ECMAScript3终将过去, ECMAScript5必然会成为主流,所以最好也理解ECMAScript5甚至包括ECMAScript6以及更好版本的内容;事实上在TC39( ECMAScript5 )的最新描述中,和ECMAScript5之后的版本又出现了一定的差异;那么按照如下顺序学习:a. 通过ECMAScript3中的概念学习JavaScript执行原理、作用域、作用域链、闭包等概念;b. 通过ECMAScript5中的概念学习块级作用域、let、const等概念;它们只是在对某些概念上的描述不太一样,在整体思路上都是一致的。1.2. 全局代码初始化假如我们有下面一段代码,它在JavaScript中是如何被执行的呢?varname="wulin"functionfoo(){varname="foo"console.log(name)}varnum1=20varnum2=30varresult=num1+num2foo()1.2.1. 初始化全局对象js引擎会在执行代码之前,会在堆内存中创建一个全局对象:Global Object(GO) 该对象 所有的作用域(scope)都可以访问;里面会包含Date、Array、String、Number、setTimeout、setInterval等等;其中还有一个window属性指向自己;1.2.2. 执行上下文(EC)在 JavaScript 引擎内部,有一个执行上下文栈(Execution Context Stack,简称 ECS),它是用于执行代码的调用栈,存储着当前正在执行的执行上下文。当 JavaScript 引擎开始执行代码时,它会先创建一个全局执行上下文(Global Execution Context,简称 GEC),并将其推入 ECS 中,表示当前正在执行全局的代码块。GEC 包含了两部分内容:第一部分是在代码执行前,JavaScript 引擎会扫描全局作用域下的变量和函数,将它们添加到全局对象(Global Object)中,并分配内存空间,但是并不会赋值。这个过程称为变量的作用域提升(hoisting)。第二部分是在代码执行中,JavaScript 引擎会对变量进行赋值,并执行其他的函数。1.3. 全局代码的执行1.3.1. VO和GO的理解每一个执行上下文会关联一个VO(Variable Object,变量对象),变量和函数声明会被添加到这个VO对象中。变量对象是一个抽象的概念,在 JavaScript 引擎内部,它被实现为一个与当前执行上下文相关联的对象。在全局执行上下文中,变量对象是全局对象(Global Object); 在函数执行上下文中,变量对象是一个称为活动对象(Activation Object)的对象。当全局代码被执行的时候,VO就是GO对象了当全局代码被执行时,变量对象(Variable Object,简称 VO)就是全局对象(Global Object,简称 GO)了。全局对象是在 JavaScript 引擎内部创建的一个唯一对象,它在全局作用域下被访问,并且可以存储全局变量、函数、内置对象和浏览器提供的 API 等等。1.3.2. 全局代码执行过程(执行前)GO 对象在执行全局代码之前就已经被创建,并且包含了一些内置对象和方法,例如 Object、Array、String、Number、Math、JSON、setTimeout、setInterval 等等。当全局执行上下文被创建时,变量对象 VO 会被设置为 GO 对象,并且全局作用域下的变量和函数会被添加到变量对象中。1.3.3. 全局代码执行过程(执行后)代码执行后就会给变