一開始的時候..

剛開始學js時，從書上看到兩種函式宣告的方式，分別是function declaration 和 function expression，基於過去粗淺地學過一顛顛其他語言，對於function declaration感到很親切，相對地對function expression就有一種天然的反感。

先來舉個例子像是，我們寫個函式來計算家裡面車子是幾年車：

//function declaration
function calcCarAgeDec(buyYear) {
  return 2023 - buyYear;
}

//function expression
const calcCarAgeExp = function (buyYear) {
  return 2023 - buyYear;
};

覺得..這..?有什麼不一樣嗎？＠＠，寫法..是有點不一樣，但在呼叫時，不都一樣要這樣寫嗎？有..差嗎？＠＠為什麼要多一種宣告方式來困擾自己呢？

const resultDec = calcCarAgeDec(2015);
const resultExp = calcCarAgeExp(2015);

console.log(resultDec, resultExp); // 8 8

意義上的不一樣

後來看了Jonas js課程後，覺得哇塞..是因為外國人的邏輯比較好嗎？我現在怎麼一點都不覺得這兩種函式宣告有什麼違合感，就像是他們裡所當然要存在，因為作用不一樣阿..!!
當我們使用functon expression宣告函式時，基本上我們就把它看做一個值，對，請摀住眼睛跟自己說，下面的紅框是一個值，我們把它存到一個叫做resultExp的變數裡

所以一個值可以傳到另一個函式當argument(變成callback function)，也可以放到物件裡當屬性的值(變成物件的method)，它就是一個值，作值本來分內的事再自然不過

//作為callbacks
const reportCarAgeImfo = function (input) {
  console.log(`我有一台${input}年車`);
};

reportCarAgeImfo(calcCarAgeExp(2018));
//我有一台5年車

以下作為物件方法的例子，雖然一般好像不會這樣寫，會改成直接在物件內寫function expression & 搭配this，但我想表達的是「把function expression當成值」這件事，所以就純參考用這樣。

//作為物件method 
const carImfo = {
  maker: "Mazda",
  carAge: calcCarAgeExp,
};

console.log(carImfo.carAge(2018));

兩種宣告方式最大的行為差異：hoisting

Hoesting中文翻作提昇，光看字面完全不知道那是什麼意思，去查了一些資料之後，發現這真的是一個很神祕的東西，表面上看起來就是，在宣告函式之前就可以先使用函式，行為上就像是"把呼叫函式這件事提到宣告之前作"，這到底是什麼神奇的設定..@@(有關hoisting更多的討論，我們留到這篇文)

也是看了Jonas(我真的不是來賣課程的！！但它的確是我迷路時的安全繩索救生圈)，了解到js運行時的機制(mechnism)，以前當製程的時候，老闆常說，如果能抓到問題發生的mechanism，離issue的終點就不遠了...

js在實際執行之前，會先掃描過整份程式碼，把裡面所有宣告的變數及函式先存在記憶體內並作對其作初始化，借Jonas的圖可以看的很清楚:function declaration會有hoisting的行為，function expression則依當初存在哪種變數而定，若是用const或let宣告，是不會有hoisting的。

引用至The completely javascript course 2023: From zero to exports

今日總結

基本上我現在大多是使用function expression在宣告函數，因為喜歡那種"把function當成一個值"的想法，很能幫助自己思考其他不那麼直覺的概念，可以說是完全顛覆了幾個月前的自己，只能說，人生想不到的事，到處都是。
當然，喜歡怎麼宣告，還是看個人偏好，都可以唷～～

ref

• Environment Variables in JavaScript: process.env