资讯专栏INFORMATION COLUMN

js预编译过程

FWHeart / 2600人阅读

摘要:所以变量声明提升和函数声明提升会出现一个先后顺序预编译过程结束。

先科普:

1.javaScript是解释型语言,就是编译一行,执行一行.....
2.javaScript没有块级及作用域......
3.javaScript具有变量和函数声明提升功能.....
4.AO对象和GO对象....
5.预编译就是解决代码执行顺序问题,与java语言类似(jvm)....

例如:

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

1.首先创建一个GO对象,和AO对象....[因为该立即执行函数是在全局作用域中执行的,立即执行函数执行时创建AO对象]

GO{
   AO{
       
   } 
}

2.找形参和变量声明,将变量和形参名作为AO属性名,值为undefined....【变量声明找到了a和b,其实形参也是一种变量声明,类似于function(a,b){var a,b;},这里的形参和函数里的变量声明a重名了,那么后一个变量声明会被忽略...】

GO{
    AO{
       a: undefined,
       b: undefined 
    }
}

3.将实参和形参统一......【实参值赋值给形参】

GO{
    AO{
        a: 1,
        b: undefined
    }
}

4.在函数体里面找函数声明,值赋予函数体....【记住,一定是变量声明在前,函数声明在后。所以变量声明提升和函数声明提升会出现一个先后顺序】

GO{
    AO{
        a: function(){...},
        b: undefined,
        d: function(){...}
    }
}

预编译过程结束。

然后开始执行:

1.执行第一行:输出function(){...}
2.执行第二行赋值:

GO{
    AO{
        a: 12,
        b: undefined,
        d: function(){...}
    }
}

3.执行第三行:输出12
4.第四行是函数声明,预编译已经执行了,跳过,执行第五行,输出:12
5.执行第六行赋值:

GO{
    AO{
        a: 12,
        b: function(){...},
        d: function(){...}
    }
}

6.执行第七行:输出:function(){...}
7.第八行是函数声明,跳过,执行完成...接下来销毁AO,再销毁GO【这里是一个js垃圾清理过程,无关本话题】

例如:
作用域链......
自己本身属性找不到就会去查找上一级的作用域中的属性...层层迭代查询
直到查到为止....
js是根据一个叫[[scope]]的属性查找的,[[scope]]是任何函数(作用域都存在)都默认自带的属性,它保存了一个数组值,长度是父级的总长度(作用域包裹的层级,长度至少为1),直到window为止,如果查不到,弹出错误...
首先[[scope]][0]保存自身预编译AO,先查找[[scope]][0],保存了该AO或者GO....
不存在时查找[[scope]][1]...
...
注意:[[scope]]属性不可枚举,无法访问...

例如:
call和apply扩展了作用域....
apply方法可以‘借用’其他对象中的方法(简称A)完成属于自己的任务,A只是暂时用于自身,其本身还是别人的,你不可以去修改A中的代码,也无法修改...
在你调用A时,apply中this指向了自身,可以这样理解:我使用了你的方法,方法里的this指向了我,我的属性(方法)增加了一项(扩展了我的作用域),但是一旦退出apply时(执行完成后),方法依然要还给你,this指向还是你,我的作用域回归原样....

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/94540.html

相关文章

  • javascript引擎执行的过程的理解--语法分析和编译阶段

    摘要:所以觉得把这个执行的详细过程整理一下,帮助更好的理解。类似的语法报错的如下图所示三预编译阶段代码块通过语法分析阶段之后,语法都正确的下回进入预编译阶段。另开出新文章详细分析,主要介绍执行阶段中的同步任务执行和异步任务执行机制事件循环。 一、概述 js是一种非常灵活的语言,理解js引擎的执行过程对于我们学习js是非常有必要的。看了很多这方便文章,大多数是讲的是事件循环(event loo...

    molyzzx 评论0 收藏0
  • javascript系列--javascript引擎执行的过程的理解--语法分析和编译阶段

    摘要:所以觉得把这个执行的详细过程整理一下,帮助更好的理解。类似的语法报错的如下图所示三预编译阶段代码块通过语法分析阶段之后,语法都正确的下回进入预编译阶段。另开出新文章详细分析,主要介绍执行阶段中的同步任务执行和异步任务执行机制事件循环。 一、概述 js是一种非常灵活的语言,理解js引擎的执行过程对于我们学习js是非常有必要的。看了很多这方便文章,大多数是讲的是事件循环(event loo...

    malakashi 评论0 收藏0
  • JavaScript的编译过程分析

    摘要:一概念是一个单线程解释型的编程语言。预编译大致可分为步创建对象找形参和变量声明,将形参和变量名作为属性名,值为将实参值和形参统一在函数体里面找函数声明,值赋予函数体。 一、JavaScript概念 JavaScript ( JS ) 是一个单线程、解释型的编程语言。 二、JavaScript语言特点 2.1 单线程 JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能...

    graf 评论0 收藏0
  • JS代码运行过程简述(一)

    摘要:是动态语言,任何一段代码在执行之前都需要编译,它跟传统的语言不同,它不是提前编译的,编译结果也不能在分布式系统中进行移植。通过特定方法将的转化为一组机器指令,用来创建一个叫作的变量包括内存分配等,并将一个值存储到中。 JS 是动态语言,任何一段代码在执行之前都需要编译,它跟传统的语言不同,它不是提前编译的,编译结果也不能在分布式系统中进行移植。 但是JS引擎进行编译的步骤和传统的编译...

    April 评论0 收藏0
  • JavaScript-编译

    摘要:预编译发生在函数执行前也就是说函数执行时,预编译已经结束。五总结理解预编译需要明白变量函数声明和变量赋值。预编译阶段,只进行变量函数声明,不会进行变量的初始化即变量赋值,所有变量的值都是变量赋值是在解释执行阶段才进行的。 一、JS的概念 JavaScript ( JS ) 是一种具有函数优先的轻量级解释型或即时编译型的编程语言。 二、JS语言特点 2.1 单线程 (1)JavaScri...

    Aldous 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<