JS学习之旅(七)函数作用域-优快云博客

本文围绕JavaScript函数作用域展开，介绍了[[scope]]即作用域，它存储运行期上下文集合。还阐述了作用域链是[[scope]]中执行期上下文对象的链式链接，以及运行期上下文在函数执行时创建、执行完销毁。同时说明了查找变量从作用域链顶端向下查找。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

作用域

[[scope]]:每个JavaScript函数都是一个对象,对象中有些属性我们可以访问,但有些不可以,这些属性仅供JavaScript引擎存取,[[scope]]就是其中一个.[[scope]]指的就是我们所说的作用域,其中存储了运行期上下文的集合.
作用域链:[[scope]]中所存储的执行期上下文对象的集合,这个集合呈链式链接,我们把这种链式链接叫做作用域链
运行期上下文:当函数执行时,会创建一个称为执行期上下文的内部对象(AO/GO).一个执行期上下文定义了一个函数执行时的环境,函数每次执行时对应的执行上下文都是独一无二的,所以多次调用一个函数会导致创建多个执行上下文,当函数执行完毕,它所产生的执行上下文被销毁.
查找变量:从作用域链的顶端依次向下查找.(查找那个作用域的变量,就从哪个作用域的顶端依次向下查找)

    function a() {
        function b() {
            var b = 234;
            // aa = 0;// a产生的aa是不是a执行时产生的AO
        }

        var aa = 123;
        b();
        console.log(aa);
    }

    var glob = 100;
    a();
// 执行代码分析
    // a函数被定义 生成a的[[scope]]
    // a.[[scope]] --> 0 : GO {}

    //
    // a函数被执行 把执行作用域放在[[scope]]的最顶端,形成新的作用域链
    // a.[[scope]] --> 0 : AO {} ; 1 : GO {}

    // b函数被定义 保留了a的[[scope]](换个角度,孩子继承父亲的)
    // a.[[scope]] --> 0 : AO {} ; 1 : GO {}

    // b函数被执行 产生执行上下文 放到自己作用域的最顶端,形成自己的作用域链,访问变量,就会按着b的执行上下文的顺序依次执行
    // a.[[scope]] --> 0 : AO {} ; 1 : AO {} ; 2 : GO {}

    // b函数执行完 销毁执行上下文 ,回归到被定义状态等待下一次被执行

    // a函数执行完 销毁执行上下文 a回归到被定义状态,等待下一次被执行,b函数被抛弃

过程分析图
在这里插入图片描述

小测试小分析


    function a() {
        function b() {
            function c() {

            }
            c();
        }
        b();
    }
    a();

    // a defined a.[[scope]] --> 0 : GO
    // a doing   a.[[scope]] --> 0 : aAO
    //                           1 : GO

    // b defined b.[[scope]] --> 0 : aAO
    //                           1 : GO

    // b doing   b.[[scope]] --> 0 : bAO
    //                           1 : aAO
    //                           2 : GO

    // c defined c.[[scope]] --> 0 : bAO
    //                           1 : aAO
    //                           2 : GO

    // c doing   c.[[scope]] --> 0 : cAO
    //                           1 : bAO
    //                           2 : aAO
    //                           3 : GO