Array|JavaScript 预解析
JavaScript是解释型的语言 , 但是他并不是真的在运行的时候逐句的往下解析执行 。
我们来看下面这个例子:func();function func(){alert("Funciton has been called");}
在上面这段代码中 , 函数func的调用是在其声明之前 , 如果说JavaScript代码真的是逐句的解析执行 , 那么在第一句调用的时候就会出错 , 然而事实并非如此 , 上面的代码可以正常执行 , 并且alert出来Function has been called 。
所以 , 可以得出结论 , JavaScript并非仅在运行时简简单单的逐句解析执行!JavaScript预解析
JavaScript引擎在对JavaScript代码进行解释执行之前 , 会对JavaScript代码进行预解析 , 在预解析阶段 , 会将以关键字var和function开头的语句块提前进行处理 。
关键问题是怎么处理呢?
当变量和函数的声明处在作用域比较靠后的位置的时候 , 变量和函数的声明会被提升到作用域的开头 。
重新来看上面的那段代码func();function func(){alert("Funciton has been called");}
由于JavaScript的预解析机制 , 上面的代码就等效于:function func(){alert("Funciton has been called");}func();
【Array|JavaScript 预解析】看完函数声明的提升 , 再来看一个变量声明提升的例子:alert(a);var a = 1;
由于JavaScript的预解析机制 , 上面这段代码 , alert出来的值是undefined , 如果没有预解析 , 代码应该会直接报错a is not defined , 而不是输出值 。
Wait a minute, 不是说要提前的吗?那不是应该alert出来1 , 为什么是undefined?
那么在这里有必要说一下声明、定义、初始化的区别 。其实这几个概念是C系语言的人应该都比较了解的 。
| 行为 | 说明 | |--|--| |声明|告诉编译器/解析器有这个变量存在,这个行为是不分配内存空间的,在JavaScript中 , 声明一个变量的操作为:var a;| |定义|为变量分配内存空间 , 在C语言中 , 一般声明就包含了定义 , 比如:int a;,但是在JavaScript中 , var a;这种形式就只是声明了 。| |初始化|在定义变量之后 , 系统为变量分配的空间内存储的值是不确定的 , 所以需要对这个空间进行初始化 , 以确保程序的安全性和确定性| |赋值|赋值就是变量在分配空间之后的某个时间里 , 对变量的值进行的刷新操作(修改存储空间内的数据)|
所以我们说的提升 , 是声明的提升 。
那么再回过头看 , 上面的代码就等效于:var a; //这里是声明alert(a);//变量声明之后并未有初始化和赋值操作 , 所以这里是 undefineda = 1;复杂点的情况分析
通过上一小节的内容 , 我们对变量、函数声明提升已经有了一个最基本的理解 。那么接下来 , 我们就来分析一些略复杂的情况 。函数同名
观察下面这段代码:func1();function func1(){console.log('This is func1');}func1();function func1(){console.log('This is last func1');}
输出结果为:This is last func1This is last func1
原因分析:由于预解析机制 , func1的声明会被提升 , 提升之后的代码为:function func1(){console.log('This is func1');}function func1(){console.log('This is last func1');}func1();func1();
同名的函数 , 后面的会覆盖前面的 , 所以两次输出结果都是This is last func1 。变量和函数同名alert(foo); function foo(){}var foo = 2;
当出现变量声明和函数同名的时候 , 只会对函数声明进行提升 , 变量会被忽略 。所以上面的代码的输出结果为function foo(){}
我们还是来把预解析之后的代码展现出来:function foo(){};alert(foo);foo = 2;
再来看一种var num = 1;function num () {alert( num );}num();
代码执行结果为:Uncaught TypeError: num is not a function
推荐阅读
- 自营区|跨界视聊为你解析:实体店生意难做,如何借助线上平台开店引流拓客?
- 国际足球|解析西班牙名单:上强度要速度,斗牛士紧跟时代潮流
- 驱动中国|“每5.4秒就有一场宠物直播”——解析快手宠物的内容生意经
- |履带移动破碎机特点及优势解析(全液压、油电混动版)
- 小米手机,雷军|全景解析小米10超大杯,雷军为何敢用“至尊”来全名?
- 行业互联网|解析未来天线技术与5G移动通信
- Array|臭氧层正在愈合,并对大气环流造成重大影响
- Array|瞄准“宅经济”!VR看房成年轻人租房新趋势
- Array|Spanlite公司使用3D打印一次高速烧结8,000个零件
- Array|面面俱到的绝佳体验 优质国产旗舰手机推荐
