文科少女學程式

上禮拜開始接觸到一個JavaScript的function，
在練習的時候，也出現了一些對於function的盲點，
所以這次特別紀錄解開函式使用盲點的方式。
 

函式(function)使用目的
前面我們先來說說為什麼要使用函數~
有時候寫程式碼的時候，難免會遇到某組成式碼需要執行好幾次的狀況。
如果是這樣最簡單的方式當然是重新打在需要再次執行的地方，
可是如果那一組程式碼的內容特別多，就會非常煩，
即使可以複製貼上，也不會是最方便的方式。
而且如果真的要用不斷複製貼上的方式，
整個程式碼的內容會非常的多，萬一後面需要改什麼地方，
就需要從一堆超長的文字尋找你要改的地方。

這個時候就可以把function派上用場啦！！
因為function可以把一整長串程式碼包在一起，
要使用他時只需要把他的名字和要帶入的引數寫進去就可以了，
這麼一來就可以省下時間，少打好幾個字了。

函式(function)的結構
我再來看看function是怎麼組成的~
在宣告函式時，結構會以四個部份結合
1. function
2. 要取的函式名稱
3. 參數(parameter)
4. { }符號框住這組函式要執行什麼內容
*參數可以設定成兩一個以上，並以( , )逗號區隔，也可以不填入參數，留空白。
實際組成的樣子會是這樣
function 名稱 (參數) {執行內容}


等到宣告函式後，後面要呼叫函式時，
只需要用將2.function名稱和帶入參數的引數就可以了。
就會呈現這個樣子
function名稱(帶入的引數)


函式參數應用
再來講一下參數的應用部分，
這也是我一直有點搞混的地方。
單看前面的說明，可能會誤以為第3點參數的部分
需要和後面帶入引數的要打入一樣的文字，
還有執行內容也要用參數一樣的變數。
實際上卻是不用的，因為參數只是暫時放入一個名稱，
並不會代表實際帶入的引數內容。
{}內的執行內容的某些變數，依照情況，
也不一定需要和參數一樣名稱的變數。

是不是讓人覺得頭暈目眩，
我也是在這裡問號了好久，
直接看例子最好搞懂~
讓我們直接看實際案例吧！
 

實際案例說明

在這個例子裡面一共有三個函式，先來看看第一個函式。

解析第一個函式

在這個函式中的參數雖然寫著players，
執行內容也有players出現，但其實這裡的參數部分，
不一定要用players。

這一個部分，再分成兩個為什麼來探討！
1. 為什麼宣告函式的時候，設定的參數可以不用一定式players？
在宣告函式時，()裡面的參數都只是寫個名稱讓後面使用的時候，
可以馬上意識到這裡可能要放入什麼已經宣告的變數，
有點像是提示文句，提示寫程式的人這個框框要擺什麼。

實際上引入了什麼，就要看後面那段真正在使用函式時，
參數部分的引數是什麼內容。
下面是真正要執行函式時(也就是呼叫函式的時候)，想要帶入的引數。

這邊寫了players，這裡的players指的是最前面宣告的陣列變數。(也就是下面的這個內容)

如果回頭看這一段

在{ }內其實就會出現一個隱形的內容，
也就是players = 一開頭的[陣列]內容
即使把這裡斜字體的players
在一開始就用其他文字填入，例如
function drawWinne (x, prize)
因為呼叫函式時，一樣是呼叫[陣列]，
所以帶入的內容一樣會是最上面的陣列。

2. 為什麼即使players變成x不會影響{}內使用players？
因為這串函式裡面執行的內容，是想要去取陣列的內容，
而宣告陣列的那一行是放在function外層的內容，
所以如果{執行內容}是用player去取陣列裡的內容一樣可以成立。
*沒有被{}框住的參數，會被套用到底下的所有函式內

同理，當players變成x，{}內取陣列的方式變成用x取，
一樣可以成立，因為在真正執行這個函式時，當作x參數使用的還是players這個陣列，
所以這個時候會變成x=[陣列內容]。

解析第二個函式

第二函式裡面一樣有兩個名字一樣的參數，就是winner。
但這裡的狀況跟第一個函式就不一樣囉！
忽略掉{}內的執行內容的話，函式裡的參數一樣可以改成任意的文字代替。
但是和{}內的執行內容搭配在一起的話，就會出現錯誤訊息。

這裡也分成兩部分探討
1. 為什麼宣告函式的時候，設定的參數可以不用一定式winner？
不論設定的參數是x還是winner，在呼叫函式時，
這個參數引用的內容都會是一樣的，
這裡的winner或是x重點都是引數內容。
也就是在函式中雖然是寫winner，
但是winner對應到的內容還是會依照實際使用函式時，
所帶入的參數而不同。

這組函式被呼叫的地方是在第一組函式裡面(紅框的部分)

引數是winner，這裡的winner是指的是綠框的部分。
所以即使宣告函式的參數改成x，一樣也是帶入
const winner = player[i]的部分。

2. 為什麼參數winner變成x會影響{}內使用winner？
還記得第一組函式的狀況嗎?
第一組的函示因為使用的參數是在函式外，所以對{}內的執行內容來說，
並不是一個沒有被定義的參數內容，也就不會出現錯誤。

但是第二組函式的狀況是如果參數變成x，
那在使用引數winner呼叫參數時，
實際框框內會有一個隱藏的變數宣告
let x = player[i] (綠框的部分)
如果使用winner這個名稱進行{}內的執行內容，
就會發現找不到winner這個參數，
因為宣告winner的地方是在第一個函式的{}裡面。
被{}隔開了，所以無法通用。
如果參數想要用x，或其他文字，那底下{}裡面的winner，
就要全部改成函式裡面設定的參數。
也就是用x的話，{}內就要寫成x.number

第三組函式也是一樣的狀況:)

結論
宣告函式時，裡面的參數可以用任意稱號填入，
但是執行內容時要用什麼要用什麼樣的內容，
就必須依照實際狀況來寫。
重點還是要清楚知道這組函式的執行內容，
到底是要執行那些內容，需要用到那些被宣告的參數。

這次整理了釐清這部分的內容時，又再一次幫自己的大腦複習了這個概念，
變得對這個概念更清楚了~
那這次的函式與參數關聯的部分，就說明到這裡囉！
掰餔