JavaScript中的预编译怎样实施？看完你就懂了啊

在代码执行前，编译器会举办如下操纵：

分词。就是将代码分成原子标记(token)

将token理会翻译成AST(语法天生树)。

碰着声明语句，将会把声明传到浸染域(scope)中建设绑定，分派内存并将变量默认设为undefined或函数体。

然后就可以执行代码啦，执行半途每次碰着赋值可能取值，城市从浸染域中查找绑定。这样看，是不是有点“预编译”内味了?可是现实上照旧称它为预处理赏罚越发贴切一点。接下来，让我们来相识一波看起来最像预编译的操纵--第三步的干货。

我的先生在和我讲相干常识点前和我说过这么一个笑话：

口试时我由于这么一个题目挂了

var a = 100 

function foo(){ 

    console.log(a) 

} 

foo() 

问：为什么输出a的值是100?

答：由于100赋值给了a。

先生说完我头昏脑涨，完全不大白笑点在哪，其后才知道这是在考查“预编译”这方面的常识。

总的来说，“预编译”可以分为

建设GO工具(global object) 产生在页面加载完成时

建设AO工具(activation object) 产生在函数执行前一刻

详细步调如下：

全局预编译

1. 建设GO工具

2. 找变量声明，将变量声明作为GO工具的属性名，并赋值undefined

3. 找全局里的函数声明，将函数名作为GO工具的属性名，值赋予函数体

局部预编译

1. 建设一个AO工具

2. 找形参和变量声明，将形参和变量声明作为AO工具的属性名，值为undefined

3. 将实参和形参同一

4. 在函数体里找函数声明，将函数名作为AO工具的属性名，值赋予函数体

以是谁人笑话里的口试题目我们应该这么答复：

起首，编译器建设一个GO工具

找到变量声明 var a

和函数声明 function foo(){}

将上面两个变量声明作为GO的属性名赋初值

GO{

a:undefined

foo:function(){}

}

然后运行第一行代码 a=100

在GO中将100赋值给a

再执行第五行代码运行foo函数

建设一个AO工具

在函数体内找变量声明和形参，(无)

再在函数体内找函数声明(无)

以是

AO{

}

完成后运行第三行代码，输出a

先在AO工具中探求a的值，发明不存在，向外部浸染域扩展，在GO工具中探求a，发明a的值为100

输出100

虽然，笑话里的题过于简朴，可是能让我们清楚的相识到这个“预编译”的举办

下面，我们来看一道口试题简化版，练练手：

global = 100 

    function fn() { 

      console.log(global);  

      global = 200 

      console.log(global);  

      var global = 300 

    } 

    fn() 

它的逻辑和输出功效是几多呢?通过一步步的说明我们可以知道详细的说明应该是这样的：

GO: { 

      global: undefined => 100, 

      fn: function() {} 

    } 

    global = 100 // 没有声明的变量默以为全局变量，也会放到GO中 

    function fn() { 

      console.log(global); // 输出undefined 

      global = 200 

      console.log(global); // 输出200 

      var global = 300 

    } 

    AO: { 

      global: undefined => 200 => 300 

    } 

    fn() 

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!