当前位置: 首页 > news >正文

javaScript的面试重点--预解析

目录

一.前言

二.预解析案例


一.前言

        关于预解析,我们通过今天学习就能够知道解析器运行JS分为哪两步;能够说出变量提升的步骤和运行过程;能够说出函数提升的步骤和运行过程。

二.预解析案例

        预解析,简而言之,也就是javaScript解析器在运行javaScript代码的时候所进行的第一步。第二步则就是执行代码,按照代码书写的顺序从上往下执行。

        在预解析过程中,JS引擎会把JS里面所有的var还有function提升到当前作用域的最前面。其中预解析又可以分为变量预解析(变量提升)和函数预解析(函数提升)。

        下面我们来分析下以下代码的执行结果:

console.log(num1)var num1=10

       

         在我们声明赋值num1变量的前面,就执行了输出num1的表达式,这样的结果会是什么呢?

我们来看下执行结果:

        

        通过运行编译我们会发现我们的执行结果是undefined,为什么会是这样的结果呢?

       这就是我们预解析的神奇之处,下面我们来分析下这个预解析的详细过程。

        因为上面那个案例有变量的声明,根据我们的变量预解析,再将变量提升之后,实际上执行的代码如下:

        

​var num1;console.log(num1)num1=10​

         

        到这里我们就可以知道,变量提升就是把所有的变量声明提升到当前作用域的最前面,但不提升赋值操作。因此这里我们的num1在声明之后,由于没有赋值,所以得到的结果自然也就是undefined了。

       

        下面我们再来看看函数的预解析:

        首先分析下下面这段代码的执行结果会是什么样的:

        

function fn(){var a=b=c=7console.log(a)console.log(b)console.log(c)}fn()console.log(c)console.log(b)console.log(a)

        结果可能出乎大家的意料哦,现在让我们来看下结果:

        

        我们可以发现最后的结果是输出5个7,跟最后一个未定义的报错提示。

         现在我们来分析下结果,由于我们用var声明多个变量的格式为:

var a=7,b=7,c=7

         中间只需用逗号隔开就可以了,而案例中的声明其实是这样的结果:

var a=7;
b=7;
c=7

       在函数中,没有使用var声明的变量就会从局部变量转为全局变量,也就是说,案例中的b和c此刻都变成了全局变量。

        因此我们在执行fn()这个函数的时候,就会把a,b,c的值都输出出来,也就是3个7。再执行b和c的输出,就把剩下的2个7给输出来。由于a使用了var声明,因此我们的a依然是fn函数里面的局部变量。因此最后的结果自然就是undefined啦。

        最后,函数的提升也就是把所有的函数声明提升到当前作用域的最前面,但不调用函数。

 

 

       

        

        

http://www.lryc.cn/news/399373.html

相关文章:

  • Gitea 仓库事件触发Jenkins远程构建
  • springboot+vue 开发记录(九)后端打包部署运行
  • 昇思25天学习打卡营第20天 | 基于MindNLP+MusicGen生成自己的个性化音乐
  • windows USB 设备驱动开发-USB主控制开发(一)
  • Dubbo 负载均衡(Load Balance)
  • ArcGIS Pro SDK (九)几何 3 点
  • 基于神经网络的分类和预测
  • VR头显如何低延迟播放8K的RTSP|RTMP流
  • 2、ASPX、.NAT(环境/框架)安全
  • 在家上网IP地址是固定的吗?
  • 交换机和路由器的工作流程
  • 算法笔记——LCR
  • ChatGPT对话:如何制作静态网页?
  • k8s(二)
  • ClickHouse表引擎概述
  • jenkins系列-04-jenkins参数化构建
  • Flutter框架时间线梳理
  • RAG 效果提升的最后一步—— 微调LLM
  • C语言 | Leetcode C语言题解之第230题二叉搜索树中第K小的元素
  • YOWOv2(yowov2)动作识别+Fastreid身份识别 详细安装与实现
  • 【微服务】Spring Cloud中如何使用Eureka
  • 【Neo4j】实战 (数据库技术丛书)学习笔记
  • 【Perl】Perl 语言入门
  • godis源码分析——database存储核心1
  • 【UE5.1】Chaos物理系统基础——06 子弹破坏石块
  • Django是干什么的?好用么?
  • C语言实现数据结构B树
  • [论文阅读]MaIL: Improving Imitation Learning with Mamba
  • 在HTML中使用JavaScript
  • InjectFix 热更新解决方案