声明:之所以分为全局预处理与函数预处理,只是为了理解方便,其实在实际运行中二者是不分先后的。

函数预处理阶段与全局预处理的差别:

  • 函数每调用一次,就会产生一个LexicalEnviroment对象,在全局预处理中该对象就是window对象,但在函数预处理中该对象是不可见,无法访问的,因为他是JS解析器的东西。
  • 函数是有参数的,在预处理时函数参数也会成为词法环境对象的成员;

然后函数内的声明式函数,var 声明式变量,冲突处理情况与全局的是一样的。

代码如下:

 <body>
<script>
function f(a, b) {
alert(a);
alert(b); var b = 100;
function a() { }
}
f(1, 2);
</script>
</body>

预处理的词法环境对象如下:

 lexcial env: {
a: 指向函数的引用,
b: 2, //函数独有的
arguments:
} 假如有函数:
function xxx(a, b){ }
调用时只传了一个参数
xxx(a);
那么词法环境对象为:
lexcial env: {
a: a;
b: undefimed
}

因为后面的var b 和函数 a命名冲突,所以按照原则处理,a由原本的参数被替换为函数引用,b不变,所以执行结果为函数a的字符串表示,2。

然后在执行阶段:

  • 给预处理的成员赋值。
  • 多个函数嵌套,每个函数都有一个LexcialEnviromment对象。
  • 函数里面没有使用var声明的变量会成为最外层的LexcialEnviromment的成员,即全局变量。

JS的解析与执行过程—函数预处理的更多相关文章

  1. JS的解析与执行过程—全局预处理阶段之全局词法环境对象

    问题:有如下代码 var a = 1; function pop() { alert(a); var a = 5; } pop();//执行结果,弹出undefined 这段代码的执行结果为undef ...

  2. JS的解析与执行过程—全局预处理阶段之命名冲突的处理策略

    有如下代码: <body> <script> alert(f); function f() { console.log("fff"); } var f = ...

  3. JS的解析与执行过程

    JS的解析与执行过程 全局中的解析和执行过程 预处理:创建一个词法环境(LexicalEnvironment,在后面简写为LE),扫描JS中的用声明的方式声明的函数,用var定义的变量并将它们加到预处 ...

  4. js全局的解析与执行过程

    先看下面实例的执行结果: alert(a);//undefined alert(b);//报错 alert(f);//输出f函数字符串 alert(g);//undefined var a = 1; ...

  5. JS引擎线程的执行过程的三个阶段(二)

    继续JS引擎线程的执行过程的三个阶段(一) 内容, 如下: 三. 执行阶段 1. 网页的线程 永远只有JS引擎线程在执行JS脚本程序,其他三个线程只负责将满足触发条件的处理函数推进事件队列,等待JS引 ...

  6. JS引擎线程的执行过程的三个阶段(一)

    浏览器首先按顺序加载由<script>标签分割的js代码块,加载js代码块完毕后,立刻进入以下三个阶段,然后再按顺序查找下一个代码块,再继续执行以下三个阶段,无论是外部脚本文件(不异步加载 ...

  7. js中的自执行匿名函数 (function(){})()

    JS函数有两种命名方式 1.声明式 声明式会导致函数提升,function会被解释器优先编译.即我们用声明式写函数,可以在任何区域声明,不会影响我们调用. function XXX(){} 2.函数表 ...

  8. js函数的解析与执行过程

    function f(a,b,c){ alert(a);//函数字符串 alert(b); var b = 5; function a(){ } } f(1,2); //预处理 lexicalEnvi ...

  9. js的解析--预处理(三)

    js的解析与执行过程  分全局  {预处理阶段和执行阶段}  函数{预处理函数和执行阶段}   1/创建词法环境(环境上下文) LexicalEnvironment   === window { } ...

随机推荐

  1. C++容器(五):set类型

    set类型 map容器是键-值对的集合,好比以任命为键的地址和电话号码.而set容器只是单纯的键的集合.当只想知道一个值是否存在时,使用set容器是最适合. 使用set容器必须包含set头文件: #i ...

  2. Qt之自定义布局管理器(QFlowLayout)

    简述 QFlowLayout,顾名思义-流布局,实现了处理不同窗口大小的布局.根据应用窗口的宽度来进行控件放置的变化. 具体实现要求不再赘述,请参考前两节内容. 简述 实现 效果 源码 实现 QFlo ...

  3. 深入理解cookie与session

    cookie和session是web开发比較基础也比較重要的知识,cookie和session用于用户的状态管理.简单的来说它们都仅仅是http中的一个配置项,在Servlet规范中也仅仅相应一个类而 ...

  4. 一站式学习WireShark

    一 基础 http://blog.sina.com.cn/s/blog_987e00020102x5k1.html 选中一个数据包,右键选中某一个数据包,然后follow-->Tcp Strea ...

  5. C&C控制服务的设计和侦测方法综述——DDoS攻击,上传从宿主机偷窃的到的信息,定时给感染机文件加密勒索等。

    这篇文章总结了一些我在安全工作里见到过的千奇百怪的C&C控制服务器的设计方法以及对应的侦测方法,在每个C&C控制服务先介绍黑帽部分即针对不同目的的C&C服务器设计方法,再介绍白 ...

  6. Struts2中Struts.xml的作用

    struts.xml 为Struts 2的核心配置文件.struts.xml文件主要负责管理应用中的Action映射,以及该Action包含的Result定义等.struts.xml中主要配置Stru ...

  7. 3.IntelliJ IDEA 使用详解

    转自:https://blog.csdn.net/wl_627292578/article/details/53796226 目录结构: InteliJ IDEA 没有工作空间的概念 project ...

  8. js base64加密与C#后台base64解密

    js代码 function encode64(input) { var output = ""; var base = new Base64(); var output = bas ...

  9. 为什么在input中加了display:inline;再加宽,还有作用?

    以前一直一位input是个行内元素,但是,行内元素的特性就是没有宽高的概念,元素多高,多宽,全凭内容撑起来的. 但是今天写了个demo,用chrome控制台显示:display:inline-bloc ...

  10. 使用Java操作Redis(一)

    Redis是一款基于key-value的数据库服务器,安装完成后我们可以通过redis-cli使用Redis提供的命令完成各种操作.redis-cli实际上就是一款客户端,和redis-server建 ...