JavaScript (function) 函式

說明 : 用來將會重複使用的程式碼封裝在一起，方便重複執行。一個函式的定義由一系列的函式關鍵詞組成，依次為：

• 函式的名稱。
• 包圍在括號()中，並由逗號區隔的一個函式參數列表。
• 包圍在大括號{}中，用於定義函式功能的一些JavaScript語句。

陳述式函式(具名函式)

函數的宣告語法：

function functionName(parameter1, parameter2, ...) {
    // statements

    // return value;
}

我們用 function 這個關鍵字來宣告一個函數
緊接著是指定這個函數的名稱 functionName
然後小括號 () 裡面指定這個函數的參數，可以用逗點 , 分隔多個參數
最後在大括號 {} 裡面則是你想封裝在這個 function 的程式碼
一個函數可以有返回值，使用 return 關鍵字來返回一個值
一個 function 如果不需要參數，小括號還是不能省略，寫成如下:

function functionName() {
    // statements
    
    // return value;
}

一個 function 也可以沒有返回值，亦即省略 return 語句，預設會返回 undefined

函式表達式(具名及匿名函式)

上述函式定義都是用的是陳述式，函式也同樣可以由函式表達式來定義。這樣的函式可以是匿名的；它不必有名稱。
例如上面提到的函式也可這樣來定義：

var expressionName = function functionName() {
    // statements
    
    // return value;
}

匿名寫法則為:

var expressionName = function () {
    // statements
    
    // return value;
}

IIFE (立即執行函式)

IIFE (Immediately Invoked Function Expression) 是一個定義完馬上就執行的JavaScript function。他又是Self-Executing Anonymous Function 翻譯是自我執行匿名函式 ，也是一種常見的設計模式，包含兩個主要部分：第一個部分是這樣的寫法可以避免裡面的變化數字污染到全域範圍。
第二個部分是馬上執行函數的表達式()，JavaScript 引擎看到它會馬上轉譯該函數。
寫法為:

(function(){...})()

箭頭函式

JavaScript在ES6(ECMAScript 2015)加入了箭頭函式 箭頭函數表達式 (=>) 的語法，使函式的語法更為簡潔。

陳述式函式(具名函式)
function functionName(parameter1, parameter2, ...) {
    // statements

    // return value;
}

改為箭頭函式寫法為:

(parameter, parameter2, ...) => {
   // statements
   
   // return value;
}

函式表達式(具名及匿名函式)

var expressionName = function functionName(parameter, parameter2, ...) {
    // statements
    
    // return value;
}

改為箭頭函式寫法為:

var expressionName = (parameter, parameter2, ...) => {
   // statements
   
   // return value;
}

// 只有一個參數時,括號才能不加:

function(單一參數) {
  statements;
}

改為箭頭函式寫法為:

(單一參數) => { statements; }
單一參數 => { statements; }

//若無參數，就一定要加括號:

function() {
  statements;
}

改為箭頭函式寫法為:

() => { statements }