JS作用域内的变量提升

作用域

作用域,可简单理解为变量起作用的区域,如下图所示:
在这里插入图片描述
此图出自《你不知道的JavaScript 上篇》的词法作用域一节,本例中有三个作用域完全嵌套而成:

  1. foo 所在的全局作用域
  2. a, b, bar所在的foo函数作用域
  3. c 所在的bar函数作用域

显而易见,在函数作用域的嵌套中,内函数可以访问到外函数的变量,而反过来,是不可以的

提升

为什么要先解释作用域呢,因为在每个作用域中,都存在自己的提升,接下来进入正题,什么,是提升?
思考以下代码的输出:

var a = 2
console.log(a)

脱口而出:2啊

那么这个呢:

a = 2
var a
console.log(a)

可能很多人会认为,输出undefined,因为看上去a在输出的时候只是被声明了而为被赋值,但当你实际运行这段代码,会发现,输出是2。
原因就是代码执行前,每个作用域内都有一个被称为提升的过程,所有变量的声明会被提升到作用域顶端。
所以上述代码实际上在运行时顺序是这样的:

var a
a = 2
console.log(a)

理解了提升,我们再来看以下代码:

console.log(a)
var a = 2

会输出什么呢?答案是undefined,请务必注意,提升只会把变量的声明提升,变量的实际操作还是在执行时发生。所以上面的代码实际上执行顺序是这样的:

var a
console.log(a)//undifined
a = 2

最后需要注意的点还有,函数声明会被提升,而函数表达式不会。看他们的语法,聪明的你应该知道是为什么了吧

函数声明,形如:function foo() {}
函数表达式,形如:var foo = function(){}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章