JavaScript語法 Function (函數)- 映美集

Function (函數)

函數 (function) 用來將會重複使用的程式碼封裝在一起，方便重複執行。

函數宣告 (Function declaration)

先來看看函數的宣告語法：

function functionName (parameter1, parameter2, ... ){
  // statements
  // return value;
}

我們用 function 這個關鍵字來宣告一個函數
緊接著是指定這個函數的名稱 functionName，
然後小括號 ( ) 裡面指定這個函數的參數，可以用逗點 , 分隔多個參數，
最後在大括號 { } 裡面則是你想封裝在這個 function 的程式碼，
一個函數可以有返回值，使用 return 關鍵字來返回一個值，
一個 function 如果不需要參數，小括號還是不能省略，寫成 function functionName( ) { }
一個 function 也可以沒有返回值，亦即省略 return 語句，預設會返回 undefined。
　例如，我們宣告一個計算平方的函數，叫它做 square ：

function square(number) {        // square 有一個參數 number，這個簡單的函數只有一行程式碼，
  return number * number;        // 最後會回傳 number * number 的結果，也就是 number 的平方，作為這個函數的返回值。
}

呼叫函數 (Calling function)

宣告一個函數並不會自動的執行它，你要使用函式呼叫的語法，來呼叫並執行一個函數的內容。
函數呼叫語法：

使用函數名稱加上 ( ) 運算子來指定傳入的參數：

functionName ( parameter1, parameter2, ... );

　例如，你可以這樣呼叫上面定義好的 square 函數：
console.log(square(10)); 　　　　　　　　 // 這樣會輸出 100
var squareValue = square(10);　　　　　　 // 可以將返回值存到一個變數
console.log(square(10) * 10); 　　　　　　// 函數呼叫的返回值，可以像變數一樣做操作, 這樣會輸出 1000

變數的存在範圍 (Function scope)

你在函數內定義的任何變數 (局部變數local variable)，只有在函數裡面才可以存取到這個變數。
在函數裡面除了可以存取到局部變數 (local variable)，也可以存取到全域變數 (global variable)。
舉個例子：

var num1 = 20;
var num2 = 3;
var name = 'Mike'; 　　　　　　　　 // 在函數外定義的變數, 為全域變數 - global scope

function multiply( ) {　　　　　　　 // 這個函數定義全域空間 - global scope
　return num1 * num2;　　　　　　// 函數內部可以存取到全域變數
}

console.log( multiply( ) ); 　　　　　// 輸出 60

function getScore ( ) {
　var num1 = 2;　　　　　　　 // 在函數內用var宣告的變數為局部變數 - function scope
　var num3 = 4;　　　　　　　 // 作用範圍只在函數內部
　name = 'Mike'; 　　　　　　　　 // 如果沒加 var 宣告變數，這個變數則是一個 全域變數
　num2 = 5; 　　　　　　　　　 // 存取到全域變數 num2
　num4 = 6; 　　　　　　　　　 // 宣告一個新的全域變數 num4
　　function add( ) { 　　　　　　　　　　　　　　 // 函數也可以宣告在其他函數內部(nested function)- function scope
　　　return name + ' scored ' + ( num1 + num2 + num3 ); 　// 內部函數可以存取到外部函數的局部變數
　　}
　return add( );
}

console.log( getScore( ) ); 　　　　　　　 // 輸出 "Mike scored 11"
console.log(name); 　　　　　　　 // 會存取到全域變數 name，輸出 Mike
console.log(num2); 　　　　　　　 // 會存取到全域變數num2，輸出 5. 因為全域變數num2在函數內部被設成 5
console.log(num4); 　　　　　　　 // 會存取到全域變數 num4，輸出 6
console.log(num3); 　　　　　　　 // 全域空間存取不到function內部的變數 . 會發生錯誤- Uncaught ReferenceError
console.log(add()); 　　　　　　　　 // 全域空間也存取不到 function 的內部函數 add( ).
　　　　　　　　　　　　　　　　 // 因為沒有呼叫函數getScore( )。會發生錯誤 - Uncaught ReferenceError

函數表達式 (Function expression)

函數在 JavaScript 是一個一級物件 (first-class object)，這意思就是一個函數可以當作別的函數的參數、函數的返回值、或做為一個變數的值。
所以你也可以用 Function expression 的方式來宣告一個函數，將一個匿名函數 (anonymous function / function literal) 當作值指定給一個變數。
這樣的函式可以是匿名的；它不必有名稱。
例如：

var square = function( number ) {
　return number * number;
};
var x = square(4) 　　　　　　 //x 的值為 16

必要時，函式名稱可與函式表達式同時存在，並且可以用於在函式內部代指其本身 (遞迴)。例如： ( <head> 內有 script 如下)

function factorial_cal(){
  var n = document.getElementById('you_data').value;
  var factorial = function fac(n) {return n<2 ? 1 : n*fac(n-1)};
  document.getElementById('input_data').innerHTML = n;
  document.getElementById('result_data').innerHTML = factorial(n);
}

請輸入 n = 計算的階乘為

函式表達式在將函式作為一個參數傳遞給其它函式時十分方便。下面的例子展示了一個叫 map 的函式如何被定義，
而後呼叫一個匿名函式作為其第一個參數：

function map(f,a) {
  var result = [], 　　　　　 // Create a new Array
      i;
  for (i = 0; i != a.length; i++)
    { result[i] = f(a[i]); }
  return result;
}

下面的程式碼呼叫 map 函式並將一個匿名函式傳入作為第一個參數:
　map( function(x) {return x * x * x}, [0, 1, 2, 5, 10] );
　　　　　　　　// 結果會回傳 [0, 1, 8, 125, 1000]