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

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

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

一、块级作用域就是用一个块结构分割变量的访问区域 块即{ } 代表语言有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 级链, 如果还没有 抛出异常

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