js预编译 --预编译详解四部曲

预编译

首先看一个例子

 var a = 10
 console.log(a);  //输出为10
console.log(a) //输出为undefined
var a = 10

出现这种情况的原因是:js解释型语言 ,也就是解释一行执行一行,第一种情况是正常输出,第二种之所以会输出undefined 而不是报错就是归功于预编译

js代码执行分为三步:

1,语法分析

2,预编译

3,解释执行

语法分析就是通篇检查你的代码有没有低级错误

预编译发生在代码执行的前一刻

解释执行就是执行你的代码

预编译的前奏

1,imply global 暗示全局变量 : 也就是任何没有经过声明的变量 此变量归全局(window)所有

b=123 //相当于  window.b = 123  暗示全局变量

2,一切声明的全局变量 归window所有

var a =123 //相当于 window.a = 123

预编译的粗浅理解(这种理解可以用来解决简单的预编译问题):

函数声明整体提升 和 变量,声明提升

当问题变得复杂,只有更透彻的理解才能理清头绪

预编译精装:

预编译四部曲:

1,创建GO/AO对象 GO:global object AO:avtive object
2,找形参和变量声明,将变量和形参名作为AO的属性名 值为undefined
3,将实参和形参相统一(也就是吧AO对象中的形参属性的值变成实参的值)
4,在函数体找函数声明 赋值给函数体

全局预编译 生成GO === window

在全局预编译完成后进行全局的代码解释执行 只有在遇到函数调用的时候才会触发函数局部的预编译

局部预编译生成AO

function f(a){
console.log(a)  //function(){}
var a = 123
console.log(a)  //123
function a(){}
var b = function(){}  //function(){}
function d(){}
}
f(1)

在这个函数中进行预编译:

1,创建AO对象 AO={ }

2;找形参和变量声明 将变量和形参名作为AO的属性名 值为undefined

AO={
    a:undefined,
    b:undefined
}

3,将实参和形参相统一

AO={
a:1,
b:undefined
}

4,在函数体找函数声明 赋值给函数体

AO = {
a:function(){}
b:undifined
d:function(){}
}

当预编译完成后开始执行其他代码

©️2020 CSDN 皮肤主题: 游动-白 设计师:上身试试 返回首页