分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

Function专题 以及js的预解析理解

发布时间:2023-09-06 01:39责任编辑:郭大石关键词:js

提问:函数可以先调用再定义吗?

回答:可以。使用“函数语句”的方式定义的函数可以“先使用,后定义”。而使用“表达式”定义的函数只能“先定义,后使用”。

在JS中,定义函数有两种方式,分别是“函数语句”和“表达式”。

函数语句写法:

1 function关键字 ??函数名(参数列表...){2 3   函数功能代码4 ?}5 ??function apple(){6 ????console.log(‘apple‘);7 ??}

 函数表达式写法:

1 var orange = function(){2 ?????console.log(orange );3 };

 下面使用了两种方式声明了两个函数,分别在不同的地方调用两个函数

 1 apple(); 2 function apple(){ 3 ????console.log("apple"); 4 } 5 ?6 var orange = function(){ 7 ????console.log("orange"); 8 } 9 orange();10 11 mango();12 var mango = function(){13 ????console.log("mango");14 }

执行结果:

所以得到结论:使用“函数语句”的方式定义的函数可以“先使用,后定义”。而使用“表达式”定义的函数只能“先定义,后使用”。

javascript 代码运行分两个阶段

1、预解析 --- 把所有的变量声明提前,所有的函数定义提前,变量的赋值不提前。
2、执行 ?--- 从上到下执行 ?(setTimeout,setInterval,ajax中的回调函数,事件中的函数例外需要触发执行)。

需要注意的点:

1、JavaScript解析器并非一行一行地分析和执行程序,而是一段一段地进行预编译后然后再执行的。

1 function fruit(){2 ????????alert("apple");3 }4 fruit(); //这里调用fruit,输出orange而不是apple5 function fruit(){6 ????alert("orange");7 }8 fruit(); //这里调用fruit,当然输出orange

两个签名完全相同的函数,在其他编程语言中应该是非法的。但在JavaScript中,可以这么写。不过,程序运行之后却发现一个奇怪的现象:两次调用都只是最后那个函数里输出的值!显然第一个函数没有起到任何作用。这是为什么呢?


原来,JavaScript执行引擎并非一行一行地分析和执行程序,而是一段一段地进行预编译后然后再执行的。而且,在同一段程序中,函数 在被执行之前 会被预定义,后定定义的 同名函数 会覆盖 先定义的函数。在调用函数的时候,只会调用后一个预定义的函数(因为后一个预定义的函数把前一个预定义的函数覆盖了)。也就是说,在第一次调用fruit之前,第一个函数语句定义的代码逻辑,已被第二个函数定义语句覆盖了。所以,两次都调用都是执行最后一个函数逻辑了。

 1 <script> 2 ????function fruit(){ 3 ????????alert("apple"); 4 ????} 5 ????fruit(); //这里调用fruit,输出apple 6 </script> 7 <script> 8 ????function fruit(){ 9 ????????alert("orange");10 ????}11 ????fruit(); //这里调用fruit,输出orange12 </script>

这时,输出才是各自按顺序来的,也证明了JavaScript的确是一段段地进行预编译后然后再执行的。

2、JS解析器先预声明变量(预定义变量只是声明了一下变量,而并没有对其赋值。),再预定义函数 。

1 alert(addB); 2 var addB = "variable";3 //结果 undefined ?JS解析器会先预定义 addB 变量为 undefined,但没有赋值4 5 var addB = "variable";6 alert(addB); 7 //结果 variable JS解析器会先预定义 addB 变量为 undefined,然后 addB 被赋值为 "variable",因此最后执行结果是 "variable"

说明了预定义变量只是声明了一下变量,而并没有对其赋值

1 alert(addB); ?//结果 ?function addB(){alert("function addB")}2 var addB = "variable"; 3 function addB() { 4 ????alert("function addB"); 5 } 6 alert(addB); ?//结果 variable

JS解析器先预定义了 addB 变量为 undefined, 但是 addB 函数覆盖了此变量,因此一开始执行结果是 function...,然后 addB 被赋值为 "variable",因此最后执行结果是 "variable"

Function专题 以及js的预解析理解

原文地址:https://www.cnblogs.com/sanerandm/p/8338450.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved