咳咳
作为一名JSer,说到“变量提升”,我们都很熟悉。曾经我也以为是这样,直到今天去百度面试,在这个问题上狠狠的栽了个跟头。
关于JSer都很熟悉的简单例子
- 变量提升
console.log(foo)
var foo = function {
console.log('hello world')
}
这是一个很简单的例子,大家应该很快能反应过来,输出的是undefined
。
- 函数提升
foo()
function foo () {
console.log('hello world')
}
这是也一个很简单的例子,大家应该很快能反应过来,foo
函数是可以完美执行的。
今天令我栽跟头的题目
// ... 假装这里有很多不相关代码
var a = function () {
console.log(1)
}
function a() {
console.log(2)
}
a()
输出啥?
如果对上面那两个例子非常熟悉,其实这一题应该是能给出答案的。
函数表达式的例子,我们可以改写为:
var a // 声明变量的操作被提升到最前面
// ... 假装这里有很多不相关代码
a = function {
console.log(1)
}
a()
如上,a
变量的声明被提前到了作用域的最前面,执行到对应处,再给a
赋值。
举一反三的话?函数声明的例子怎么改呢?
举一反三的话,就一定错了。因为举着一个西瓜,是反不出一个苹果的。
function foo () {
console.log('hello world')
}
// ... 假装这里有很多不相关代码
foo()
对于函数声明的提升,提升不仅仅是函数声明,而是这个函数的所有。我们总是把变量提升挂在嘴边,误以为变量声明提升(函数表达式本质也是一个变量声明)和函数声明提升是一回事,却忽视了重要的整体提升概念。
所以综合以上,可以把这道的面试题改下如下:
var a
function a() {
console.log(2)
}
// ... 假装这里有很多不相关代码
a = function () {
console.log(1)
}
a()
改写成这样的话,我想应该没有人会不知道输出什么吧?
很可惜,机会是留给有准备的人,我错过了一次好机会
原文首发于我的博客:https://www.vq0599.com/p/34
转载请注明出处