函式的構成與使用

函式是構成 JavaScript 的基本要素之一，忘記的話，請看 JavaScript 的語法構成 這篇文章。

一個函式本身就是一段 JavaScript 程序，包含用於執行某一個任務或計算的語法。有時亦可將多段要執行的事項包裝起來。在呼叫某個函式之前，必須要先在這個函式要執行的範圍中定義它。

函式的定義

1. 關鍵字: function。
2. 自定義的函式名稱: todo。有時也有可能沒有。
3. 小括號: ()。
4. 大括號: {}。
5. 欲執行的工作事項放在 {} 中。

function todo () {
  // 執行的第一個事項
  // 執行的第二個事項
  // 執行的第三個事項
}

函式的呼叫

準備好的函式並不會自動執行，必須呼叫它才會執行，呼叫 1 次就執行 1 次，呼叫 100 次便執行 100 次。 todo() 便是呼叫函式執行。

function todo () {
  // 執行的第一個事項
  // 執行的第二個事項
  // 執行的第三個事項
}

todo();

函式的參數與引數

參數

Line 1: () 中的內容稱作 參數，可以是一個或多的形式出現，它們之間以 , 進行分隔。

引數

Line 7: calc(10, 5) 為呼叫 calc 函式，() 中的內容稱作 引數，它們之間以 , 進行分隔，也是呼叫函式時所傳遞的值。

function calc (x, y) {
  const total = x + y;

  console.log(total);
}

calc(10, 5);

arguments 獲取全部的參數

我們也可以在函式中利用 arguments 這個變數來取出所有傳入函式中的值。

function calc () {
  // [10, 5]
  console.log(arguments);
}

calc(10, 5);

arguments 是個 類陣列，故無法使用陣列內建的方法。

function calc () {
  // [10, 5]
  console.log(arguments);
  // 10
  console.log(arguments[0]);
  // 5
  console.log(arguments[1]);
  // 15
  console.log(arguments[0] + arguments[1]);
}

calc(10, 5);

類陣列 --> 陣列

• Array.from: Array.from(arguments)
• ES6 展開運算子: [...arguments]