【JS】理解作用域与作用域链

1.什么是作用域？

在ECMAScript中的定义是变量的适用范围。我们了解在js中变量分为两类局部变量和全局变量，全局变量的作用域是全局的，在函数内部声明的变量我们称之为局部变量，作用域是局部的只在函数体内有意义。

2.彼此独立的的区间不能互相访问，全局变量都可以访问，外层函数不能访问里层的，里层可以访问外层的，越往里权限越高。

3.每个js对象都有属性，有些可以被我们访问，有些不行，这些属性仅供js引擎存取，我们要讲的[[scope]]就是这样的一个属性，它指的就是我们所说的作用域，其中存储了运行期上下文的集合。

4.当函数在执行前的一刻，会创建一个称之为执行期上下文的内部对象，一个执行期上下文定义了一个函数执行时的环境，函数每次执行的上下文都是独一无二的，因为在函数执行完后这个内部对象将被销毁。而[[scope]]中存储的执行期上下文对象的集合，呈链式链接我们称之为作用域链。

 function a(){
   function b(){
       var bb=234;
       aa=0;
   }
   var aa =123;
   b();
   console.log(aa);
}
var glob =100;
a();

要解决这个问题我们只需画出其作用域链即可。

按照上文，当a函数被定义时，会创造一个执行期上下文，我们在scope中进行存储

a.[[scope]] ->scope chain[0]->Global Object 这个Global Object我会在编写预编译时具体解释，你现在只需知道这是全局作用域即可 里面存储了两个全局变量 函数a和变量glob；

下一步是什么，不是b的定义，而是a的执行，a执行之后才有b的定义不是吗。在a函数执行时我们可以再添加一个执行期上下文再就是a.[[scope]]->scope chain[0] ->Activation Object  （这个就是a函数的局部作用域）我们可以发现里面也有两个变量函数b和变量aa 而scope chain[1]则指向Global Object，

这是a函数的作用域链，里面存了两个执行期上下文，接下来轮到b函数被定义，按照上文的规则，内部函数可以访问外部，所以b函数的作用域链上天生就挂着a函数的作用域链，当函数b执行时在会发生，b.[[scope]]->scope chain[0] ->Activation Object （这个就是b函数的局部作用域）里面定义了变量b 而scope chain[1]则是之前的a函数的局部作用域，scope chain[2]则是全局作用域

当b函数执行完它给aa赋值0，但它scope chain[0]没有这个变量，他就沿着作用域链向外访问scope chain[1]中有aa且值为123，进行修改，scope chain[1]中的aa值为0，因此输出结果是0；

值得注意的是我们可以发现a函数的执行才带来了b函数的定义，因为在js中为了节省效率，当一个函数未执行时，计算机并不会花费时间去检测函数体中的内容。可能在作用域的讲解中会存在知识盲区，建议先观看我写的js预编译，将有助于对作用域与作用域链的理解，顺便挖个坑，我们都是知道es6之前没有块级作用域，我将在写es6时讲解let和const所带来的块级作用域。