JavaScript作用域链及案例详解

    xiaoxiao2025-02-01  13

    javascript作用域讲解以及画图解释:

    首先,要先理解,在其他开发语言中,常见的作用域规则:块级作用域和 词法作用域。

    然而什么叫作用域? 即 起作用的区域 ;定义变量后,可以在哪一个范围内使用该变量。

    块级作用域

    所谓的块级作用域就是用一个块结构分割变量的访问区域 即 { } 直接包围的区域。代表语言:c(c 系类)。

    词法作用域

    词法作用域就是变量的作用范围,在书写代码的时候就已经决定,与运行时无关 ,另外,js中分割作用域的只有函数;

    还有,浏览器在预解析下,有两个重要的特点:① 声明会提升  ②只有函数才会限定作用域。

    有了以上的概念,下面就开始讲绘制作用域链的规则:

    1> 将全部的 script 标签看做一个整体. 是一个 0 级别的链;

             把全局范围内的变量, 函数, 对象... 归为链中的成员,用一个小框表示出来;

             由于函数声明和变量定义在浏览器预解析阶段会提升, 因此可在绘制链之前将代码进行调整,将声明都写在前面, 这样绘图的时候按照顺序绘制, 将会简化作用域链的难度。

    2> 由于只有函数才可以限定作用域. 因此在函数上引出一条新链,级别为 n + 1;

             在函数内部, 又是一个完整, 独立的作用域结构;

             因此在函数内部定义的任何成员也按照 1> 中的规则在该链上展开。

    3> 如果函数内还有函数, 将继续绘制下去,即可。

     

    由此可以得出变量搜索原则:

    在代码的运行过程中, 如果访问某一个变量;

    那么首先在当前链上找 ( 无序 ), 如果没有, 在 n-1 级上找;

    ( 在函数内部允许访问定义在函数外部的变量 );

    如此往复, 直到 0 级链, 如果还没有就抛出异常;

    如果找到, 则结束寻找, 直接获得并返回该链上变量的数据。

    下面画图解释:

    转载请注明原文地址: https://ju.6miu.com/read-1295975.html
    最新回复(0)