javascript函数作用域链 词法作用域

Posted 2020-07-03 Go web

在开发语言中常见的作用域规则有  块级作用域和词法作用域

作用域 顾名思义就是起作用的区域  定义一变量后 ，可以在此范围作用的区域

一、块级作用域就是用一个块结构分割变量的访问区域  块即{ } 代表语言有C 系列语言

二、词法作用域就是变量的作用范围，在书写代码时就已经决定作用的范围，与运行时无关

特点：分割作用域只有函数

变量名提升

函数名提升

函数的声明比变量的声明优先级高

function a(){     
}  
var a;  
alert(a);//打印出a的函数体  
  
var a;  
function a(){     
}  
alert(a);//打印出a的函数体  

//但是要注意区分和下面两个写法的区别:   
var a=1;  
function a(){     
}  
alert(a);//打印出1  
  
<script>  
function a(){     
}   
var a=1;  
alert(a);//打印出1  

    function test() {  
    
    bar(); // 2  
    var foo = function () { // 变量指向函数表达式  
        console.log("1");  
    }  
    function bar() { // 函数声明 函数名为bar  
        console.log("2");  
    } 
    foo();//1
}  
test(); 

但是
    function test() {  
    foo();//报错
    bar();   
    var foo = function () { // 变量指向函数表达式  
        console.log("1");  
    }  
    function bar() { // 函数声明 函数名为bar  
        console.log("2");  
    } 
   
}  
test(); 

 结论
1、声明会提升 

2、 只有函数才会限定作用域
绘制作用域链规则
    1> 将全部的 script 标签看做一个整体. 是一个 0 级别的链
    链中所有的全局范围内的变量, 函数, 对象... 都是链中的成员
   由于声明会提升, 因此在绘制链之前将代码可以进行调整, 在开始的时候
    将声明都写在前面, 绘图的时候按照顺序绘制, 较为简单.
   
   2> 由于只有函数才可以限定作用域. 因此在函数上引出一条新链, 级别为 n + 1
   在函数内部, 又是一个完整, 独立的作用域结构
   因此在函数内部定义的任何成员也按照 1> 中的规则在该链上展开

　3> 如果有函数, 继续绘制下去

 变量搜索原则
 在代码的运行过程中, 如果访问某一个变量
 那么首先在当前链上找 ( 无序 ), 如果没有, 在 n-1 级上找
 ( 在函数内部允许访问定义在函数外部的变量 )
 如此往复, 直到 0 级链, 如果还没有 抛出异常
 如果找到, 则结束寻找, 直接获得该链上变量的数据