在定義函式時，最常用大概就「陳述式函式、表達式函式、箭頭式函式」這三種，尤其在 ES6 中，用箭頭式函式可以讓語法變得更精簡，也常和 map()、filter()、reduce() 這類的陣列方法搭配使用，以下就來說明一下這三種定義函式的差異和使用的情境！
這次要筆記的就是：
陳述式函式 ( Function Declaration )
表達式函式 ( Function Expression )
箭頭式函式 ( Arrow Function )
快速尋找
1. 陳述式函式 ( Function Declaration )
說明：
使用 function 關鍵字定義的函式。它有一個很特別的特性是「提升( Hosting )」，也就是呼叫陳述式函式時，可以在此函式上方或是下方呼叫都可以，因為陳述式函式在執行時會自動放到最上方去做執行
陳述式函式一定要有函式名稱！
寫法：
function 函式名稱(參數) {
// 執行內容
}範例：
用 function 關鍵字定義一個函式
→ 只要參數進來就回傳「參數+2」的動作，而在呼叫此函式時，不論是在此函式上方或下方呼叫都可以成功執行
2. 表達式函式 ( Function Expression )
說明：
將函式賦值指定給一個常數或是變數的形式。這邊要注意的是，表達式函式沒有「提升 ( Hosting ) 」的特性，也就不會像陳述式函式在執行時，會自動放到最上面去做執行，所以呼叫表達式函式時，一定要在此函式下方做呼叫，否則程式會導致錯誤
表達式函式的賦值可以是常數或變數，但通常建議用 const 去搭配表達式函式，這樣比較不會因為意外指定了新的值而覆寫掉原本的函式
表達式函式可以不用寫函式名稱！
寫法：
const/let 常數/變數名稱 = function(參數) {
// 執行內容
}範例：
以賦值一個常數的形式來定義函式
→ 只要參數進來就回傳「參數+2」的動作，而在呼叫此函式時，一定要在此函式下方呼叫才可以成功執行
3. 箭頭式函式 ( Arrow Function )
說明：
是 ES6 引入的一種簡潔的定義函式語法，用 ⇒ 來取代 function 關鍵字。這邊要注意的是，箭頭式函式和表達式函式一樣沒有「提升 ( Hosting ) 」的特性，所以箭頭式函式時，一定要在此函式下方做呼叫，否則程式會導致錯誤
箭頭式函式沒有自己的 this 綁定，會繼承外層的 this
寫法一：
一般寫法
const/let 變數/常數名稱 = (參數) => {
// 執行內容(多行)
return
}寫法二：
當執行內容只有一行並且有返回值時，可以同時省略 return 和 {}
const/let 變數/常數名稱 = (參數) => // 執行內容(一行)寫法三：
當參數只有一個、執行內容只有一行並且有返回值時，可以同時省略 () 、 return 和 {}
const/let 變數/常數名稱 = 參數 => // 執行內容(一行)寫法四：
若沒有參數時，還是要寫 ()
const/let 變數/常數名稱 = () => // 執行內容(一行)
或
const/let 變數/常數名稱 = () => {
// 執行內容(多行)
return
}範例：
以賦值一個常數的形式來定義函式，只是將 function 關鍵字改成 ⇒
→ 只要參數進來就回傳「參數+2」的動作，而在呼叫此函式時，一定要在此函式下方呼叫才可以成功執行
可以簡寫成
又或是再簡寫成
如果沒有參數，也要寫 ()
