1. 犀牛前端部落首页
  2. Javascript百科

Javascript基础:变量提升

Javascript语言中有很多我们难以想象的坑,学习这些东西不代表这是多么高大上的技术,而是为了以后填坑。

博主将会尽量总结我知道的一些坑,方便大家学习交流。

今天跟大家探讨的就是Javascript中的变量提升,新手经常会困惑,为什么执行结果和我预期的不一样,还请大家不要失去信心,Javascript不是一个神创造的语言,总归会有一些类似于typeof null 等于 object 这种事情发生,记不住不怪你,而是怪创始人,真的是他设计的不好~

博主将会尽量总结我知道的一些坑,方便大家学习交流。

首先我们来考虑一下以下代码:

a = 2
var a ;
console.log(a)

没有经验的开发者肯定会认为输出undefined,实际上输出的是2。

是不是感觉很难以相信?

接下来我们再看一个怪代码:

console.log(a) //undefined
var a = 2;

上面的代码会输出 undefined,有些同学可能会认为输出的是2,或者应该抛出错误 ReferenceError。

这种奇怪的现象,应该用什么知识来解释呢?

Javascript 引擎会在解释Javascript代码之前首先对其进行编译。编译阶段有一部分的工作做的就是找到所有的生明,并用合适的作用域将它们关联起来。

看了上面的,同学们有没有豁然开朗,因此所有的变量和函数的生明都会在任何代码被执行前首先被处理。

下面我们重新看一看之前的代码。

当我们看到var a = 2;时,Javascript引擎实际上会看成两个声明:var a;和a = 2。第一个定义声明将会在编译阶段进行,第二个赋值声明会在原地等待执行阶段。

因此上面的代码可以写成这样:

console.log(a) //undefined
var a = 2;
/*之前的代码等同于下面这样*/
var a;
console.log(a)
a = 2;

这样看是不是就很容易知道输出应该是undefined呢?这个过程就叫做变量提升

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/961.html

发表评论

登录后才能评论