完全明白Javascript中的作用域链

2019年8月31日 115次阅读 来源: 传播正能量

1 定义

我们已晓得一个实行高低文中的数据(参数，变量，函数)作为属性存储在变量对象中。

也晓得变量对象是在每次进入高低文是建立并填入初始值，值的更新涌现在代码实行阶段。

作用域链就是这些变量对象的链表。

让我们看一下和作用域相干的高低文组织
VO是当前高低文的变量对象，重点是Scope属性，Scope = VO+[[scope]]。个中[[scope]]为一切父高低文变量对象的链表。

activeExecutionContext = {
    VO: {...}, // or AO
    this: thisValue,
    Scope: [ // Scope chain
      // 一切变量对象的列表
      // for identifiers lookup
    ]
};

函数的生命周期分为建立和激活。

2 函数建立阶段

var x = 10;
  
function foo() {
  var y = 20;
  alert(x + y);
}
  
foo(); // 30

此前，我们仅仅谈到有关当前高低文的变量对象。这里，我们看到变量“y”在函数“foo”中定义（意味着它在foo高低文的AO中），然则变量“x”并未在“foo”高低文中定义，响应地，它也不会添加到“foo”的AO中。乍一看，变量“x”相关于函数“foo”基础就不存在；但正如我们在下面看到的——也仅仅是“一瞥”，我们发明，“foo”高低文的运动对象中仅包括一个属性－－“y”。

fooContext.AO = {
y: undefined // undefined – 进入高低文的时刻是20 – at activation
};

函数“foo”怎样接见到变量“x”？理论上函数应该能接见一个更高一层高低文的变量对象。实际上它恰是如许，这类机制是经由历程函数内部的[[scope]]属性来完成的。

[[scope]]是一切父变量对象的层级链，处于当前函数高低文之上，在函数建立时存于个中。

注重这主要的一点－－[[scope]]在函数建立时被存储－－静态（稳定的），永久永久，直至函数烧毁。即：函数可以永不挪用，但[[scope]]属性已写入，并存储在函数对象中。

3 函数激活阶段

正如在定义中说到的，进入高低文建立AO/VO以后，高低文的Scope属性（变量查找的一个作用域链）作以下定义：

Scope = AO|VO + [[Scope]]

上面代码的意义是：运动对象是作用域数组的第一个对象，即添加到作用域的前端。
Scope = [AO].concat([[Scope]]);

这个特性关于标示符剖析的处置惩罚来讲很主要。

标示符剖析是一个处置惩罚历程，用来肯定一个变量（或函数声明）属于哪一个变量对象。
标识符剖析历程包括与变量名对应属性的查找，即作用域中变量对象的一连查找，从最深的高低文最先，绕过作用域链直到最上层。

如许一来，在向上查找中，一个高低文中的局部变量较之于父作用域的变量具有较高的优先级。万一两个变量有雷同的称号但来自差别的作用域，那末第一个被发明的是在最深作用域中。

4 闭包

在ECMAScript中，闭包与函数的[[scope]]直接相干，正如我们提到的那样，[[scope]]在函数建立时被存储，与函数共存亡。实际上，闭包是函数代码和其[[scope]]的连系。

由于闭包函数在建立的时刻就建立了父级的变量对象链表，也就是父级作用域链， 然后闭包函数再接见父级作用域链中的变量，致使父级函数实行终了后依然不能开释实行高低文的状况。

5 经由历程组织函数建立的函数的[[scope]]

在上面的例子中，我们看到，在函数建立时取得函数的[[scope]]属性，经由历程该属性接见到一切父高低文的变量。然则，这个划定规矩有一个主要的破例，它涉及到经由历程函数组织函数建立的函数。

var x = 10;
  
function foo() {
  
 var y = 20;
  
 function barFD() { // 函数声明
alert(x);
alert(y);
}
  
 var barFE = function () { // 函数表达式
alert(x);
alert(y);
};
  
 var barFn = Function('alert(x); alert(y);');
  
barFD(); // 10, 20
barFE(); // 10, 20
barFn(); // 10, "y" is not defined
  
}
  
foo();

我们看到，经由历程函数组织函数（Function constructor）建立的函数“bar”，是不能接见变量“y”的。但这并不意味着函数“barFn”没有[[scope]]属性（不然它不能接见到变量“x”）。问题在于经由历程函组织函数建立的函数的[[scope]]属性老是唯一的全局对象。考虑到这一点，如经由历程这类函数建立除全局以外的最上层的高低文闭包是不可能的。

6 全局和eval高低文中的作用域链

这里不一定很风趣，但必需要提醒一下。全局高低文的作用域链仅包括全局对象。代码eval的高低文与当前的挪用高低文（calling context）具有一样的作用域链。

globalContext.Scope = [
Global
];
  
evalContext.Scope === callingContext.Scope;

7 代码实行时对作用域链的影响

在ECMAScript 中，在代码实行阶段有两个声明能修正作用域链。这就是with声明和catch语句。它们添加到作用域链的最前端，对象须在这些声明中涌现的标识符中查找。假如发作个中的一个，作用域链扼要的作以下修正：

Scope = withObject|catchObject + AO|VO + [[Scope]]

eval代码运转的字符串应用当前挪用的高低文，而且可以修正当前高低文中的变量对象，也就是说eval内和eval外的代码一样，只是不能变量提拔，实行起来是一样的。
with代码块和catch代码块都改变了作用域链，然则在他们代码块中声明的变量，也存在了函数作用域中，只是with的对象和catch对象外部不能接见罢了。

eval('var x=3');
console.log(x); //3      
with (obj1) {
    var innner ='inner';
    console.log(a); //1
    console.log(b); //2
}
console.log(innner); // inner 仍能接见
console.log(a) //接见不到
try {
    throw new Error('error')
}
catch (e) {
    var cat = 2;
}
console.log(cat); //2 仍能接见

英文原文：http://dmitrysoshnikov.com/ec…
本文绝大部分内容来自上述地点，仅做少量修正

    原文作者：传播正能量
    原文地址: https://segmentfault.com/a/1190000007906750
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞