javascript痛点之二作用域链

1.执行环境（执行上下文）

先看段代码

var  a = 10;
var  b = 20;

function cc(){
  var c = 30;
   alert("b="+b);
}
cc();
alert(c);//报错

为什么我们在函数cc中可以访问到全局变量b而外部却访问不了局部变量c呢？

这就是执行环境的作用:它定义了变量或函数是否有权访问其他数据，决定各自行为。

在javascript中有三种可执行的类型

1.Global Code，即全局的、不在任何函数里面的代码，例如：一个js文件、嵌入在HTML页面中的js代码等。

2.Eval Code，即使用eval()函数动态执行的JS代码。

3. Function Code，即用户自定义函数中的函数体JS代码。

不同的类型有不同的执行环境,我们只讨论全局执行环境和函数执行环境

2.每一个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中

javascript痛点之二作用域链

在这个方框里就是一个大的执行环境对应的有一个变量对象,这个变量对象我们在程序中是没法访问它的,那它的作用是什么呢？

我们定义的变量a,b,函数cc都是定义在变量对象(variable Object),后台在解析的时候是解析的变量对象的，这就是变量对象的概念。

3.作用域链

看段代码

//执行环境window对象（最上层的执行环境）
var color1 = "blue";
function changeColor(){ //每一个函数都有一个执行环境
    var color2 ="red";
    function swapColor(){
        var color3 = color2;
         color1 = color3;
         //这里可以访问color1,2,3
     }
     //这里可以访问color1,color2,但不可以访问color3
    swapColor();
}
 //这里只能访问color1
changeColor();//第一个作用环境 changeColor是最外层的window作用域，

在上面的大的执行环境中,可以看到变量color1和函数changeColor，执行changeColor(),代码会从color2代码开始执行到完毕。

当代码执行到swapColor函数的时候,这个函数又产生了一个执行环境（因为每一个函数都有一个执行环境）,

当执行到 var color3 = color2;代码中就相当于

    var color2 ="red";
    function swapColor(){
        var color3 = color2;
         color1 = color3;
         //这里可以访问color1,2,3
     }

color2是全局变量所以函数swapColor可以访问到。

当访问到swapColor()是不可以访问到color3的。

所以我们就得出一个作用域链的概念

当我们的执行环境依次执行到changeColor和swapColor时会产生一个链条，这个链条决定了整个变量的访问权限

环境变量一层一层的向上进行追溯,可以访问它的上级环境（变量和函数）

这就是作用域链的概念

就是一层一层的向上找

c3可以访问c2也可以访问c1 但不能向下访问。

假设c1是一级作用域,c2是二级作用域,c3是三级作用域

在c3中访问c1它会怎么做呢

1.先在swapColor函数内查找c1 结果没有发现c1

2.继续向上查找

3.发现c2作用域还是没发现c1

4.继续向上查找

5.找到c1

(完

javascript痛点之三闭包

秒客网

javascript痛点之二作用域链

相关文章