首頁猿問 JavaScript：函數聲明與函...

JavaScript：函數聲明與函數表達式？

AngularJS

森林海 2019-02-12 10:07:36

為什么這個是無效語法呢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!");};}

查看完整描述

3 回答

慕俠2389804

TA貢獻1719條經驗獲得超6個贊

javascript雖然是解釋執(zhí)行的語言，但也會進行預編譯。

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

這種形式，JS引擎在預編譯的過程中會注冊方法到window對象下，就是window.sayHi。

而不會顧及if else條件，導致重復的sayHi方法被注冊，在這種情況下是無效語法。

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

而下面這種是作為一個變量（而非函數function），變量是可以被重復賦值的，所以語法不會有問題。

不知道有沒有說清楚。

反對回復 2019-03-24

絕地無雙

TA貢獻1946條經驗獲得超4個贊

我只說第一個。

第一個語法上沒什么問題，但是和瀏覽器解析js不同而獲得意想不到的結果。

1. 在前面調用。

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

這種時候除了firefox會報錯，其他的瀏覽器會彈出“Yo!"。

2. 在后面調用

12345678910 if(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.

所以這種不兼容的方法不要使用。

反對回復 2019-03-24