前言
在上一篇【修炼JavaScript】javascript中的作用域和执行上下文中，我们讲到了JavaScript中的执行上下文的管理方式，即利用执行上下文栈进行管理。
JavaScript的执行上下文中包含3个重要的属性：
- 变量对象（Variable object , VO）
- 作用域链（Scope chain）
- this
今天我们就来讲讲其中的变量对象和作用域链，读完本文你可以知道和理解如下知识点：
- 清除变量对象和活动对象是什么，理解它之间的区别。
- 知道函数的活动对象的创建时机以及它具体的创建过程。
- 知道[[Scopes]]属性的创建时机。
- 理解函数的[[Scopes]]属性与作用域链之间的关系。
变量对象
变量对象是与执行上下文相关的数据作用域，存储了和上下文相关的变量和函数声明。
不同的执行上下文（全局，函数，eval）的变量对象有所不同，这里主要讲解：
- 全局变量对象（全局对象）
- 函数活动对象
全局对象
在W3School中有对全局对象的描述如下：
全局对象是预定义的对象，作为 JavaScript 的全局函数和全局属性的占位符。通过使用全局对象，可以访问所有其他所有预定义的对象、函数和属性。
在顶层 JavaScript 代码中，可以用关键字 this 引用全局对象。所有非限定性的变量和函数名都会作为该对象的属性来查询。例如，当JavaScript 代码引用 parseInt() 函数时，它引用的是全局对象的 parseInt 属性。全局对象是作用域链的头，还意味着在顶层 JavaScript 代码中声明的所有变量都将成为全局对象的属性。
在 Web 浏览器中，全局对象是浏览器窗口。
看不太懂？我再来总结一下：
- 在顶层代码中，全局对象可以通过this应用。在客户端浏览器，全局对象就是window对象。
this === window // true
- 作为全局变量和全局函数的宿主
var a = 1
function fn(){
console.log(a)
}
window.a // 1
this.a // 1
window.fn() // 1
this.fn() // 1
- 预定义了一大堆属性和方法
window.Math.max(1,2) // 2
this.Math.max(1,2) // 2
Math.max(1,2) // 2
- 在客户端中有window属性指向自身
this.window === window // true
函数活动对象
函数的变量对象用活动对象（activation object , AO）来表示，其实变量对象和活动对象是同一个东西，知识变量对象是规范上或者引擎实现上的，它其中的属性和方法外部无法访问，而只有当进入函数执行上下文将变量对象激活成活动对象时，它上面的方法和属性才可以访问。
之前在【修炼JavaScript】javascript中的作用域和执行上下文中讲到：在遇到函数调用时会进行两步：
- 创建执行上下文
- 代码执行
创建执行上下文时会将该函数上下文压入执行上下文栈中
contextStack.push(functionContext)
接下来进入代码执行阶段，该阶段具体来说又分为2步：
1??进入执行上下文（准备阶段）
2??执行代码
用一个图来表示代码执行时遇到函数调用的步骤：
函数活动对象在进入执行上下文时利用函数的arguments对象进行初始化，最终活动对象会包括：
- arguments对象
- 函数的所有形参（没有实参时值为undefined）
- 函数的所有函数声明：活动对象已经有相同名称的属性时会覆盖该属性。
- 函数的所有变量声明（初始化为undefined）：活动对象已经有相同名称的属性或方法时不会影响原属性和方法。
举一个例子：
function foo(a) {
var b = 2;
function c() {}
var d = function() {};
b = 3;
}
foo(1);
进入函数执行上下文，在代码执行前AO长这样：
AO = {
arguments: {
0: 1,
length: 1
},
a: 1,
b: undefined,
c: reference to function c(){},
d: undefined
}
在代码执行阶段会根据代码给AO的属性赋值，代码执行之后长这样
AO = {
arguments: {
0: 1,
length: 1
},
a: 1,
b: 3,
c: reference to function c(){},
d: reference to FunctionExpression "d"
}
作用域链
在之前在【修炼JavaScript】javascript中的作用域和执行上下文中我们讲过，函数的作用域是在定义函数时就确定的，具体来说其反映在函数的内部属性[[Scopes]]上。
在函数创建时，会将所有父变量对象添加到[[Scopes]]中，但是[[Scopes]]并不是完整的作用域链，此时作用域链还没有确定，它只是作用域链的一部分。
在函数调用时，进入执行上下文激活函数创建AO后，会复制[[Scopes]]创建作用域链，并把AO添加到其最前端，此时作用域链才真正创建完成。也就是说作用域链是在执行代码前的准备阶段确定的。
这么说可能还是不太清楚，看个例子：
var scope = "global scope";
function checkscope(){
var scope2 = 'local scope';
return scope2;
}
checkscope();
1??在checkscope定义时，将所有父变量对象添加到checkscope的[[Scopes]]里
checkscope.[[Scopes]] = [
globalContext.VO
]
2??代码执行，遇到函数调用checkscope()，创建执行上下文并压入栈中。
contextStack = [
checkscopeContext,
globalContext
]
3??进入执行上下文，开始准备阶段第一步：复制[[Scopes]]创建作用域链
checkscopeContext = {
ScopeChain: checkscope.[[Scopes]]
}
4??准备阶段第二步：用arguments创建活动对象，初始化活动对象，加入形参，变量声明和函数声明。
checkscopeContext = {
AO: {
arguments: {
length: 0
},
scope2: undefined
},
ScopeChain: checkscope.[[Scopes]]
}
5??准备阶段第三步：将AO添加到作用域链顶端
checkscopeContext = {
AO: {
arguments: {
length: 0
},
scope2: undefined
},
ScopeChain: [ AO , checkscope.[[Scopes]] ]
}
6??准备工作完成，开始执行代码，修改AO的属性
checkscopeContext = {
AO: {
arguments: {
length: 0
},
scope2: 'local scope'
},
ScopeChain: [ AO , checkscope.[[Scopes]] ]
}
7??查找到scope2的值并返回，函数执行完毕，执行上下文出栈
contextStack = [
globalContext
]
总结
总结就来一张自己画的图，搞懂这张图并能自己画出来就差不多了。
