我的编程空间,编程开发者的网络收藏夹
学习永远不晚

JavaScript预解析处理过程原来是这回事

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

JavaScript预解析处理过程原来是这回事

 讲解

一般来说,Javascript代码的执行包括两个过程:预解析处理过程 和 逐行解读过程。在代码逐行解读前,Javasript引擎需要进行代码的预处理过程。预解析处理的工作主要是变量提升和给变量分配内存,具体过程是在每个作用域中查找var声明的变量、函数定义和命名函数(函数参数),找到它们后,在当前作用域中给他们分配内存,并给他们设置初始值。预解析设置的初始值分别是:对于var声明的变量,初始值是undefined,对函数定义,变量名为函数名,函数变量的初始值为函数定义本身;对命名参数,如果函数调用时没有指定参数值,则命名参数的初始值为undefined,如果函数调用是指定了参数值,则命名参数的初始值为指定的参数值。

注:对于变量声明的同时赋值的语句,例如:var a = 9,Javascript引擎对它进行处理时把该语句分拆为两条语句:var a和a=9,其中,var a在预解析阶段进行处理,a=9是赋值表达式,在逐行解读阶段进行赋值。所以预解析中,不管变量声明时是否有赋值,变量的初始值都是undefiend。

1.预解析发生的时机

(1)、遇到标签对之间的代码块进行预解析:找到函数定义和函数体外的所有var声明的变量,并给它们分配内存和设置初始值。

对同名的var变量和函数变量,只会分配一次栈内存。但在堆内存中会给函数变量的初始值分配内存。对变量赋初始值时,函数变量初始值优先级高于var变量初始值,而同级别的函数变量,后定义的函数优先于先定义的函数。

所以var变量名和函数变量名相同时,如果内存中的变量的值一开始为undefined,但最终内存中该变量的初始值会替换为函数变量的值;否则变量的初始值保持不变。而同名的函数变量,后面定义的函数会替换前面定义的函数。

(2)、遇到函数时

每一对标签中的代码预解析完后会立即逐行解读代码。在解读代码的过程中,如果遇到函数调用,此时会在函数作用域中首先进行预解析处理,预解析处理完才会执行函数代码。在函数作用域的预解析规则是:找到命名函数、所有var变量和函数定义,并给它们在函数作用域中分配内存和设置初始值。对同名的var变量、命名参数和函数变量,只会分配一次栈内存,但在堆内存中会给函数变量的初始值分配内存。对变量赋初始值时,函数变量的值优先级最高,其次是命名参数值。所以命名参数名和var变量名相同,内存中变量的值是参数值;如果命名参数名和函数变量名相同或var变量名和函数变量名相同,内存中变量的值为函数变量值。

2.页面中包含多个标签时的预解析

当页面中包含多个标签时,javascript引擎会按页面中标签出现的顺序,从上往下对每一个标签对之间的脚本代码块分别进行预解析和逐行解读处理。每一个标签对之间代码的预解析是全局范围的,在函数调用时发上发生的函数代码预解析则是针对函数范围的。

需要注意的是,变量在预解析处理得到的初始值在逐行解读代码过程中会被赋值表达式(带有=,+=,-=,*=,/=,++,--等运算符号的语句)修改。

示例

我们通过几个示例来详细看一下。

预解析变量的优先级示例:

  1.  

弹出框结果分别为:

1处弹出的内容:

  1. (1)该行结果是: 
  2. function a(){ 
  3.    alert(4); 

3处弹出的内容:

  1. (2)该行结果是: 3 

7处弹出的内容:

  1. (3)该行结果是: 6 

上述运行结果正是预解析和逐行解读分阶段处理的结果。Javascript引擎遇到标签时,开始按代码出现的顺序进行预解析处理:首先预解析注释2处的var变量a,给它分配内存,并给他赋初始值为"undefined";然后预解析注释4处的函数变量a,发现该变量和已分配内存的var变量同名,所以不再对函数变量a分配栈内存,而只给它分配堆内存存储函数定义,同时会将栈内存中的变量a的值修改为函数变量的初始值function a(){alert(2);};再接着预解析注释5处的var变量a,该变量与前面预解析得到的函数变量a同名,所以对该变量也不再分配内存,由于函数变量值优先于var变量值,所以此时注释5处的var变量a初始值undefined不会修改内存变量的函数定义值;最后预解析注释6处的函数变量a,发现它和内存中的变量a同名,也不再给它分配内存,但会在堆中分配内存存储6处的函数定义。由于后定义的函数优先级高于前面定义的函数,此时内存的变量a的函数定义值被修改为function a(){alert(4);}。因此最终内存中的变量a的初始值为function a(){alert(4)};。至此,预解析完成。

接着进行逐行解读代码。在逐行解读代码阶段,首先解读到注释1处代码,此时会去内存中查找变量a,如果找到,读取变量a的值并输出到警告对话框中;如果没找到,将报a is not defined错误。上面的预解析的结果是内存中存在变量a,且其值为function a(){alert(4);}。注释2处的代码是一个赋值表达式:a=3,执行该代码后,会将内存中的变量a的值修改为“3”。所以执行到注释3处代码时,从内存中读取到的值为“3”。注释4处定义了一个函数,执行时会跳出函数定义不作任何操作。注释5处代码是一个赋值表达式:a=6,执行该行代码后,会将内存中的变量a的值修改为“6”。注释6处又是一个函数定义,不作解读。最后执行了注释7处的代码,从而读取到值“6”。

 

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

JavaScript预解析处理过程原来是这回事

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

JavaScript预解析处理过程原来是这回事

一般来说,Javascript代码的执行包括两个过程:预解析处理过程 和 逐行解读过程。
JavaScript2024-12-03

编程热搜

  • Python 学习之路 - Python
    一、安装Python34Windows在Python官网(https://www.python.org/downloads/)下载安装包并安装。Python的默认安装路径是:C:\Python34配置环境变量:【右键计算机】--》【属性】-
    Python 学习之路 - Python
  • chatgpt的中文全称是什么
    chatgpt的中文全称是生成型预训练变换模型。ChatGPT是什么ChatGPT是美国人工智能研究实验室OpenAI开发的一种全新聊天机器人模型,它能够通过学习和理解人类的语言来进行对话,还能根据聊天的上下文进行互动,并协助人类完成一系列
    chatgpt的中文全称是什么
  • C/C++中extern函数使用详解
  • C/C++可变参数的使用
    可变参数的使用方法远远不止以下几种,不过在C,C++中使用可变参数时要小心,在使用printf()等函数时传入的参数个数一定不能比前面的格式化字符串中的’%’符号个数少,否则会产生访问越界,运气不好的话还会导致程序崩溃
    C/C++可变参数的使用
  • css样式文件该放在哪里
  • php中数组下标必须是连续的吗
  • Python 3 教程
    Python 3 教程 Python 的 3.0 版本,常被称为 Python 3000,或简称 Py3k。相对于 Python 的早期版本,这是一个较大的升级。为了不带入过多的累赘,Python 3.0 在设计的时候没有考虑向下兼容。 Python
    Python 3 教程
  • Python pip包管理
    一、前言    在Python中, 安装第三方模块是通过 setuptools 这个工具完成的。 Python有两个封装了 setuptools的包管理工具: easy_install  和  pip , 目前官方推荐使用 pip。    
    Python pip包管理
  • ubuntu如何重新编译内核
  • 改善Java代码之慎用java动态编译

目录