一道奇怪的JS面试题一

题目如下:

var a = 0;
if (true) {
    a = 1;
    function a() {return '123'}
    a = 21;
    console.log(a);
}
console.log(a);

按照正常思路, 我们应该考虑变量提升.

即是说, 代码等价于如下效果

function a() {return '123'}
var a = 0;
if (true) {
    a = 1;
    a = 21;
    console.log(a); //21
}
console.log(a); //21

 

但话说回来, 把函数声明写在判断语句中, 如果{ } 被看做代码块的话

那么函数的声明应在代码块内做提升.

即是说, 代码等价于如下效果

var a = 0;
if (true) {
    function a() {return '123'}
    a = 1;
    a = 21;
    console.log(a);  //21
}
console.log(a);  //0

然而实际的结果却不是这样的

先来看看IE的结果

21
21
//以上打印结果为IE浏览器 10版本

但是到了IE11 和 最新的 edge浏览器就变了

21
function a() {return '123'}
//以上打印结果为IE浏览器 11版本  和 edge浏览器

显然IE11认为, 函数声明为全局, 并且, 函数也没有进行提升, 而是当成了表达式

因此, 代码等价于

var a = 0;
if (true) {
    let a1 = 1;
    window.a = function() {return '123'}
    a1 = 21;
    console.log(a1);  //21
}
console.log(a);  // fn...

 

我们再测试谷歌和火狐浏览器：

21
1
//以上打印结果为chrome浏览器 76.0.3809.87版本

谷歌浏览器跟火狐一致认为, 直到出现了函数声明, 变量a才出现了局部作用

函数依然被当成了表达式, 而不是一个声明

即是说, 代码等价于如下

var a = 0;
if (true) {
    a = 1;
    let a1 = function() {return '123'}
    a1 = 21;
    console.log(a1);  //21
}
console.log(a);  // 1

 

总结

当函数被声明在判断语句内部时,

所有浏览器都将 函数声明 当成了表达式(赋值声明)

并且, 对于是否为全局声明, 也有分歧.

 

结论

永远不要把函数定义在条件判断中

 

为什么要出这种奇怪的题目来考察别人呢

是心理的扭曲? 还是道德的沦丧? ^_^

 

其实吧, 作为一个正常的程序员

你或许从来不会把函数定义在判断语句中

 

不知道很正常

知道了也不能说明什么.