js 中作用域的问题

Question

以下两段代码：

var a = 11;
var foo = function() {
    var a = 10;
    console.log(a)
};
foo() //结果a=10

var a = 11;
var foo = function(){
    console.log(a)  
}
var bar = function(){
    var a = 10;
    foo() 
}
bar() //结果a=11

第一个比较好理解，foo函数中的内部AO=>[a:10]；[[Scope]]=>[a : 11]；AO优先性高，所以输出a=10；
但是第二个是什么原因？

bar函数中，bar的AO=>[a:10];[[Scope]]=>[a:11];
在bar中调用foo函数，为什么内部AO没有优先的调用呢？

问题：
在调用bar()时，其内部作用域是如何变化的？
foo跟bar的关系是什么样的？

烦请指教！

Answer 1

第二种 foo 的 AO 里面没有变量a，所以就查找foo的Scope 找到 a=11；
你的理解错误是把 bar的 AO当成 foo 的AO了.
而活动对象（AO）是在函数执行时创建
var foo = function(){
//这里没有声明 var a=10所以foo执行时,foo的AO里没有a

console.log(a)  

}

Answer 2

因为js的作用域是静态作用域，简而言之就是函数调用的是在其定义的环境下求值而非运行时的环境下求值（假如该语言是动态作用域的话那么结果就为10了，其函数调用是在运行时环境下（即运行时栈）求值），对于第二个bar中的foo调用是在foo定义是的环境下求值，显然foo内的指向的是全局作用域的a，而此时全局作用域的a的值为11，bar内的var a = 10,定义了一个新的变量a，虽然名字相同但不是同一个变量。加入把这里的var去掉的话，则此时a和全局的a就是同一个变量，此时打印的结果就为10了。需要严格的区分几个概念变量名，变量，值，定义时环境，运行时环境。