這很基本,不過為了了解後面的說明,還是要提一下,JavaScript 有兩種語法分類:陳述式與表達式。而了解這兩種語法分類之後,後半段會提到,JavaScript 基於這些觀念,在函式宣告上具有獨特不同的運作方式。
Outline
- 陳述式( Statement )
- 表達式 ( Expression )
- Expression Statements
- 函式陳述式 (Function Statement)
- 函式表達式 (Function Expression)
陳述式( Statement )
陳述式一定會做一些事情,但陳述式不會產生數值。所以不能被放在 JS 內預期會產生數值的地方,例如函式的參數、函式的回傳值、或是宣告變數時等號的右邊(不能分配給另一變數)。
陳述式會產生動作
下面這些都是 JavaScritp 裡的陳述式:
-
變數宣告
-
if 判斷式
-
while 迴圈
-
for 迴圈
-
switch 判斷是
-
for-in 迴圈
-
直接的函式宣告
var a = 3 ;
if(a === 3){
//doSomeThing…
}{
//doSomeThing , this is a Block Statement
}for (var i = 0 ; i<=10 ; i++ ){
//doSomeThing
}try{
…
}catch (){
…
}
上面這些例子都是陳述式,會執行某些動作,而且通常是在執行環境產生時就會被執行。值得注意的是區塊陳述 ( Block Statement ),就像 if 的區塊一樣,在裡面會執行一些動作,但執行完成後也不會回傳任何數值,區塊陳述也是一樣的概念,只是一定會執行,不會經過判斷。
另外,變數的宣告為什麼是陳述式?他會做什麼動作嗎?會的,JS 引擎在這個時候會幫你留一個記憶體空間,並把這個變數名稱跟記憶體空間做連結,函式宣告也是一樣的道理,等等就可以看到。
表達式 ( Expression )
表達式是一段可以很長,但會產生結果值的程式碼,而且很常是運算式。
An expression is a phrase of JavaScript that a JavaScript interpreter can evaluate to produce a value. - JavaScript: The Definitive Guide
表達式是一段 JS 直譯器能夠運算並產生數值的程式碼。
1 + 2
functionInvocation()
ture || false d
true && true
a = 3 //會回傳 3
a === 3
Array.isArray([]) ? doSomeThing() : doOtherThing()
上面這些用法都是表達式,我們應該都用習慣了,但是如果沒有特別注意就不會特地去分類。好,現在我們知道陳述式會執行動作、表達式會回傳某值,接下來我們要看看比較特別的部分。JS的函式宣告,根據不同的方式可以是宣告式也可以是表達式函式,這兩種方法則分別稱為「函式陳述式」跟「函式表達式」。
函式陳述式( Function Statement )
函式陳述式是藉由直接給定名字來直接宣告一個函式。剛剛有說到變數宣告會使 JS 引擎來幫你保留記憶體空間,所以是陳述式。像這樣子直接的函式宣告,跟變數宣告會產生的行為是一樣的,差別是整個函式內容在語法解析階段都會保留進記憶體空間,這個行為就是之前提到的提升 ( Hoisting ),所以屬於函式的陳述式。
function functionStatement (){
//doSomething
}
函式表達式 ( Function Expression )
另外一種宣告函式的方式是函式表達式,是把一個匿名函式指派給一個變數,這種宣告方式的函式內容不會在一開始就被提升,會被提升的只有該變數而已。在執行階段,才會把函式內容指派給變數,以下面程式碼為例,這個時候 functionExporession 才是一個可以用的函式,而變數的指派屬於表達式,因此這種方式也被稱為函式表達式。
var functionExpression = function(){
//doSomeThing
}