ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JS预编译过程

2021-09-18 14:02:05  阅读:138  来源: 互联网

标签:function console 函数 AO JS 编译 test 过程 log


GO和AO

变量的预编译

实例1

console.log(a);
var a=1;
console.log(a);

实际编译过程:

将a存入预编译对象中,赋值为undefined;
真正的赋值语句当程序运行到时才会执行。

实例1等价:

var a=undefined;
console.log(a);//undefined
a=1;
console.log(a);//1

GO(Global Object)

预编译过程

先创建GO对象(Global Object),再创建AO对象(Activation Object)。
GO:先不看函数内部的代码

  1. 创建GO对象;
  2. 找 变量声明,将 变量 作为GO属性名,值为undefined;
  3. 再找 函数声明,值赋予函数体;

GO对象创建完成,开始读代码,直到读到全局调用test函数时,函数预编译,开始创建AO对象(预编译发生在函数执行的前一刻)

实例2

console.log(test); //function
function test(test) {
   console.log(test); 
   var test = 234; 
   console.log(test); 
   function test() {} 
} 
test(1); 
var test = 123;//test=123 覆盖属性test:function
console.log(test);//123
  1. 创建GO对象;

    GO { }
    
  2. 找 变量声明,将 变量 作为GO属性名,值为undefined;

    GO {
    test : undefined
    }
    
  3. 再找 函数声明,值赋予函数体;

    GO {
    test : function test(test) {
    // … 整个函数体 }
    }
    

    GO对象创建完成,开始读代码,直到读到全局调用test函数时,函数预编译,开始创建AO对象(预编译发生在函数执行的前一刻)


AO(activation object )

全称:活跃对象/执行期上下文,在函数执行前执行函数预编译,此时会产生一个AO对象,AO对象保存该函数的参数变量。

函数预编译步骤:

  1. 产生AO对象
  2. 将函数的形参和函数内声明的变量当作AO对象的属性名,值全为undefined。变量的赋值在原先的位置
  3. 将实参赋值给形参属性
  4. 在函数内声明的函数,函数名作为OA的属性名,函数体赋值给值。(若函数名和变量重名,函数体会覆盖原先的变量值)

实例3

function test(a) {
    console.log(a);
    var a = 2;
    console.log(a);
    function a () {}
    console.log(a);
    var b = function () {};
    console.log(b);
    function d(){}
}
test(1);

创建AO对象

AO{
//此时AO对象为空
}

确定AO对象的属性名

AO{
a:undefined; //函数参数
b:undefined; //函数里面声明的变量
}

将实参值赋值给形参

AO{
a:1; //函数参数
b:undefined; //函数里面声明的变量
}

处理函数里面的声明函数

var b=function( ){ };时不会把函数体给到b属性的。b仍然是undefined.
function a( ){ }; 才会覆盖a属性。

AO{
a:function a () {} //变量名一样,值覆盖
b:undefined, //函数里面声明的变量
d:function d () {}
}
function test(a) {
    console.log(a);//function a;
    var a = 2;//a=2; 覆盖AO中的属性值
    console.log(a); //2;
    function a () {} //预编译时已经处理过了,直接跳过
    console.log(a); //2
    console.log(b); //undefined; bs变量 尚未赋值
    var b = function () {};//b=function(){}; 覆盖
    console.log(b);//function (){};
    function d(){}
}
test(1);

标签:function,console,函数,AO,JS,编译,test,过程,log
来源: https://www.cnblogs.com/Chen03/p/15308429.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有