前言

今天進入認識函式的第二天，隨著學習內容越來越多，會默默發現怎麼Google搜尋的次數反而才是增加最多的地方(還是其實是我腦容量太少囧)，有時會注意到明明都是函式怎麼就有這麼多不一樣的寫法?所以今天來認識一下常見的寫法吧!

先把昨天的加法函式召喚寫出來好進行比對吧！

function addition(num_1, num_2) {
	return num_1 + num_2
}

console.log(addition(3, 5)) // 8

匿名函式

當我們看到把函式當成值放進變數的方法時，即是採用匿名函式(其實就是把名字移到前面啦)，用匿名函式方式來完成加法函式會是像這樣：

const addition = function(num_1, num_2) {
	return num_1 + num_2
}

console.log(addition(3, 5))

從上面的寫法可以看出其實除了宣告的方式不同外(宣告一個adiition的函式或把匿名函式放入addition變數裡面)，呼叫函式的方式是相同的。

但是仍有其使用上需要注意的地方，函式有個稱作提升(hoisting)的特性，即宣告的函式瀏覽器在載入頁面時會優先進行讀取，再開始執行程式的內容，所以即使將輸出寫在函式的上方，仍可以順利的得到輸出結果。

console.log(addition(3, 5)) // 8

function addition(num_1, num_2) {
	return num_1 + num_2
}

console.log(addition(3, 5)) // 8
// 上下的輸出都會順利得到結果

可是如果是採匿名函式的方式時，由於函式被寫在變數裡面，這樣的優先特權就自然地被沒收將它當作一般程式碼的部分，所以輸出必須得在變數以下才能夠執行，否則程式會回報錯誤。

console.log(addition(3, 5))  // ReferenceError: Cannot access 'addition' before initialization
const addition = function(num_1, num_2) {
	return num_1 + num_2
}

箭頭函式

ES6新增的語法，非常可愛又迷人的反派角色，網上蒐查資料時其實可以看到很多人喜歡運用箭頭函式來進行撰寫，最主要的原因就在於它將語法更加簡化，但有時候學習還在消化的過程時很容易所有東西混在一起，所以今天我們先認識它就好(可能是我太笨XD)：

const addition = (num_1, num_2) => num_1 + num_2
console.log(addition(3, 5)

箭頭函式最大的特色是當只有一行語句時，會自動加return，而在使用大括號{}內搭配多行語句方式時，就還是需要自己加上return。

當然，箭頭函式同樣也還是有使用上的限制，像是碰到與this有關的問題時，箭頭函式有時候並不適用於部分情況，可能會得到不如預期的結果或錯誤，所以雖然箭頭函式很方便但在使用上還是要多注意哦。