欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

js函数预编译的具体步骤,很详细

程序员文章站 2022-03-16 12:13:45
预编译的四个步骤预编译四步曲1、创建AO对象(Activation Object)(执行期上下文:函数产生的存储空间库)2、找形参和变量声明,将变量和形参名作为AO属性名,值为undefined3、将实参值和形参统一4、在函数体里面找函数声明,值赋予函数体这里有个小细节:函数声明与函数表达式区别:function a(){} //这是函数声明var a=function a(){} //这是函数表达式具体的过程是这样://不同地方的 console.log(a);...

预编译的四个步骤

预编译四步曲
1、创建AO对象(Activation Object)(执行期上下文:函数产生的存储空间库)
2、找形参和变量声明,将变量和形参名作为AO属性名,值为undefined
3、将实参值和形参统一
4、在函数体里面找函数声明,值赋予函数体

这里有个小细节:函数声明与函数表达式区别:

function a(){}   //这是函数声明

var a=function a(){}  //这是函数表达式

具体的过程是这样:

//不同地方的 console.log(a); 输出结果是什么?
function fn(a){
   console.log(a); //在AO里找值--->输出 function a() {}
   var a = 123; //预编译将 var a;提升上去了,执行 a = 123;修改AO中a的值
   console.log(a); //输出 123
   function a() {} //预编译读过,不再读
   console.log(a); //输出 123
   var b = function() {} //将函数表达式赋给AO中的b,b的值改为function () {}
   console.log(b); //输出funtion () {}
   function d() {}//AO中已读不再读
}
fn(1);
//预编译发生在函数执行的前一刻;预编译也发生在全局,第一步为创建GO对象;
GO(Global Object) === window

执行结果为:

js函数预编译的具体步骤,很详细

第一步:创建AO对象:我们隐式的在函数中创建了一个AO的对象来盛放函数中的变量,此时对象中并没有值;
第二步:找形参和变量声明,将变量和形参名作为AO属性名,重复的只写一个即可,值为undefined;

js函数预编译的具体步骤,很详细
第三步:将实参值和形参统一,实参1传给a,更改a的值为1   
js函数预编译的具体步骤,很详细
第四步:在函数体里面找函数声明,值赋予函数体,这里函数声明有function a() {} 、  function d() {},注意:  var b = function() {}是函数表达式,不是函数声明。

js函数预编译的具体步骤,很详细

最后:在进行完预编译后此时若执行函数则会以AO为基础对函数中的变量进行赋值,预编译读过的语句,就不用再次读,执行的时候直接从AO里取值。读取赋值语句,配合AO完成赋值过程。

想了一下,还是追加几个练习比较妥当~

练习一:

 function test(a,b) {
              console.log(a);   //1
              c = 0;     //将c=0赋给AO中的c     
              var c ;
              a = 3 ;    //将a=3赋给AO中的a
              b = 2 ;    //将b=2赋给AO中的b
              console.log(b); //2
              function b(){ }//预编译已读不再读
              function d(){ }//预编译已读不再读
               console.log(b); //2
              }  
              test(1);

预编译过程:

第一步:创建AO对象
第二步:AO{
	        a:undefined
	        b:undefined
	        c:undefined
}

第三步:AO{
	        a:1
	        b:undefined
	        c:undefined
}
第四步:AO{
	        a:1
	        b:b(){ }
	        c:undefined
	        d:d(){ }
          }

执行结果为:

js函数预编译的具体步骤,很详细 

2.练习二:

  function test(a,b){
                 console.log(a); // function a(){}  
                 console.log(b); //undefined 
                 var b =234;  //将b=234赋给AO中的b
                 console.log(b);  //234
                 a=123;         //将a=123赋给AO中的a  
                 console.log(a);  //123
                 function a(){}  //预编译已读不再读
                 var a;
                 b=234;          //将b=234赋给AO中的b
                 var b = function(){}//将函数表达式赋给AO中的b
                 console.log(a);  //123
                 console.log(b);  //function(){}
              }
  test(1);

预编译过程:

第一步:AO{}
第二步:AO{
	a:undefined
	b:undefined
}
第三步:AO{
	a:1
	b:undefined
}
第四步:AO{
	a:function a(){}  
	b:undefined
}

 执行结果:

js函数预编译的具体步骤,很详细

练习到这里,大家肯定对js函数预编译过程比较清楚了,希望我的分析能够帮助到大家,欢迎大家指正。

 

 

 

本文地址:https://blog.csdn.net/weixin_44164982/article/details/107314659