十分钟读懂作用域链

323 阅读1分钟

用一句话表述作用域链

作用域链,是由当前环境与上层环境的一系列变量对象组成,它保证了当前执行环境对符合访问权限的变量和函数的有序访问。

自己的话:用来规范当前环境中找不到相应变量对象时,如何向上层环境进行有序访问

看例子理解

var a = 20;

function test() {
    var b = a + 10;

    function innerTest() {
        var c = 10;
        return b + c;
    }

    return innerTest();
}

test();

在上面例子中,先后创建了全局,test函数,innerTest内嵌函数的执行上下文,随后有了对应的变量对象:AO(global),VO(test),VO(innerTest)。

而innerTest的作用域链中,分别连接了AO(global),VO(test),VO(innerTest)这三个变量对象。如下图所示:

作用域链图示

如果用json对象表示innerTest的作用域的话,则看以下对象:

innerTestEC = {
    VO: {...},  // 变量对象
    scopeChain: [VO(innerTest), VO(test), VO(global)], // 作用域链
}

总结

由上述内容,我们不难得出:作用域链只是用来规范变量对象的访问顺序的。

所有的变量对象都需要在当前的AO/VO中寻找,当找不到的时候就去查找上层执行上下文的AO/VO。这样一级一级向上查找的过程,就是作用域链啦~

参考

前端基础进阶(四):详细图解作用域链与闭包

JavaScript深入之作用域链

JavaScript进阶之作用域