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虽然是解释执行的语言，但也会进行预编译。123456789if(condition){    function sayHi(){        alert("Hi!");    }}else{    function sayHi(){        alert("Yo!");    }}这种形式，JS引擎在预编译的过程中会注册方法到window对象下，就是window.sayHi。而不会顾及if else条件，导致重复的sayHi方法被注册，在这种情况下是无效语法。12345678910var sayHi;if(condition){    sayHi=function sayHi(){        alert("Hi!");    };}else{    sayHi=function sayHi(){        alert("Yo!");    };}而下面这种是作为一个 变量（而非函数function），变量是可以被重复赋值的，所以语法不会有问题。不知道有没有说清楚。

Answer 2

我只说第一个。第一个语法上没什么问题，但是和浏览器解析js不同而获得意想不到的结果。1. 在前面调用。1234567891011sayHi();var condition = true;if(condition){    function sayHi(){        alert("Hi!");    }}else{    function sayHi(){        alert("Yo!");    }}这种时候除了firefox会报错，其他的浏览器会弹出“Yo!"。2. 在后面调用12345678910if(true){    function sayHi(){        alert("Hi!");    }}else{    function sayHi(){        alert("Yo!");    }}sayHi();firefox会弹出"Hi!"，其他的浏览器会弹出"Yo!"。这里firefox会出现这种情况是因为firefox会把if里面的function定义当作表达式来处理。MDN的原文Functions can be conditionally declared. That is, a function definition can be nested within an if statement. Technically, such declarations are not actually function declarations; they are function expressions.所以这种不兼容的方法不要使用。

Answer 3

function sayHi(){alert('hi')}function sayHi(){alert('Yo')}你写的第一个无效那个，等于分开写，下面的就会把上面的覆盖掉，只显示下面的了