请问各位大神JavaScript：函数声明与函数表达式

Question

为什么这个是无效语法呢if(condition){function sayHi(){alert("Hi!");}}else{function sayHi(){alert("Yo!");}}而下面这个确是有效的var sayHi;if(condition){sayHi=function sayHi(){alert("Hi!");};}else{sayHi=function sayHi(){alert("Yo!");};}

Answer 1

javascript虽然是解释执行的语言，但也会进行预编译。

1 2 3 4 5 6 7 8 9

if(condition){     function sayHi(){         alert("Hi!");     } }else{     function sayHi(){         alert("Yo!");     } }

这种形式，JS引擎在预编译的过程中会注册方法到window对象下，就是window.sayHi。

而不会顾及if else条件，导致重复的sayHi方法被注册，在这种情况下是无效语法。

1 2 3 4 5 6 7 8 9 10

var sayHi; if(condition){     sayHi=function sayHi(){         alert("Hi!");     }; }else{     sayHi=function sayHi(){         alert("Yo!");     }; }

而下面这种是作为一个 变量（而非函数function），变量是可以被重复赋值的，所以语法不会有问题。

不知道有没有说清楚。

 

 

Answer 2

我只说第一个。

 

第一个语法上没什么问题，但是和浏览器解析js不同而获得意想不到的结果。

 

1. 在前面调用。

1 2 3 4 5 6 7 8 9 10 11

sayHi(); var condition   = true; if(condition){     function sayHi(){         alert("Hi!");     } }else{     function sayHi(){         alert("Yo!");     } }

这种时候除了firefox会报错，其他的浏览器会弹出“Yo!"。

 

2. 在后面调用

1 2 3 4 5 6 7 8 9 10

if(true){     function sayHi(){         alert("Hi!");     } }else{     function sayHi(){         alert("Yo!");     } } sayHi();

firefox会弹出"Hi!"，其他的浏览器会弹出"Yo!"。

 

这里firefox会出现这种情况是因为firefox会把if里面的function定义当作表达式来处理。

 

所以这种不兼容的方法不要使用。

 

Answer 3

我来说一下，其实 这个函数等于这样

function sayHi(){
alert('hi')
}
function sayHi(){
alert('Yo')
}

你写的第一个无效那个，等于分开写，下面的就会把上面的覆盖掉，只显示下面的了

Answer 4

当然无效了，定义函数/对象有两种方式，一般来说效果是差不多，但是也有一点点区别：

方式1，

1 2 3 4

//这种定义，浏览器首先会把所有的函数定义先预留 function sayHi(){     alert("Hi!"); }

方式2，

1 2 3 4

//这种定义，浏览器运行到这一行，才会定义函数 var sayHi   = function(){     alert("Hi!"); }

 

Answer 5

实在不明白你这段代码的目的。

如果你只是需要在不同的condition提示不同的alert, 那么只需要如下就可以了。
if(condition){
alert("Hi!");
}else{
alert("Yo!");
}

如果你需要在不同的condition定义不同的SayHi()函数。那么很明显，只有下面的才是正确的。
上面的做法不管从任何角度看都是乱来。 如果JS支持把局部定义默认为全局的(PHP可以)，那么上面这样就叫重复定义。如果JS不支持把局部当全局用，那么你上面的做法跳出if/else的范围，此函数为未定义(不存在).