JavaScript 函數

JavaScript 函數是被設計為執行特定任務的代碼塊。

JavaScript 函數會在某代碼調用它時被執行。

實例

function myFunction(p1, p2) {
    return p1 * p2;              // 該函數返回 p1 和 p2 的乘積
}

親自試一試

JavaScript 函數語法

JavaScript 函數通過 function 關鍵詞進行定義，其后是函數名和括號 ()。

函數名可包含字母、數字、下劃線和美元符號（規則與變量名相同）。

圓括號可包括由逗號分隔的參數：

(參數 1, 參數 2, ...)

由函數執行的代碼被放置在花括號中：{}

function name(參數 1, 參數 2, 參數 3) {
    要執行的代碼
}

函數參數（Function parameters）是在函數定義中所列的名稱。

函數參數（Function arguments）是當調用函數時由函數接收的真實的值。

在函數中，參數是局部變量。

在其他編程語言中，函數近似程序（Procedure）或子程序（Subroutine）。

函數調用

函數中的代碼將在其他代碼調用該函數時執行：

  • 當事件發生時（當用戶點擊按鈕時）
  • 當 JavaScript 代碼調用時
  • 自動的（自調用）

您將在本教程中學到更多有關函數調用的知識。

函數返回

當 JavaScript 到達 return 語句，函數將停止執行。

如果函數被某條語句調用，JavaScript 將在調用語句之后“返回”執行代碼。

函數通常會計算出返回值。這個返回值會返回給調用者：

實例

計算兩個數的乘積，并返回結果：

var x = myFunction(7, 8);        // 調用函數，返回值被賦值給 x
function myFunction(a, b) {
    return a * b;                // 函數返回 a 和 b 的乘積
}

x 的結果將是：

56

親自試一試

為何使用函數？

您能夠對代碼進行復用：只要定義一次代碼，就可以多次使用它。

您能夠多次向同一函數傳遞不同的參數，以產生不同的結果。

實例

把華氏度轉換為攝氏度：

function toCelsius(fahrenheit) {
    return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);

親自試一試

() 運算符調用函數

使用上面的例子，toCelsius 引用的是函數對象，而 toCelsius() 引用的是函數結果。

實例

訪問沒有 () 的函數將返回函數定義：

function toCelsius(fahrenheit) {
    return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius;

親自試一試

用作變量值的函數

函數的使用方法與變量一致，在所有類型的公式、賦值和計算中。

實例

使用變量來存儲函數的值：

var x = toCelsius(77);
var text = "The temperature is " + x + " Celsius";

您能夠把函數當做變量值直接使用：

var text = "The temperature is " + toCelsius(77) + " Celsius";

親自試一試

您將在本教程中學到更多有關函數的知識。

局部變量

在 JavaScript 函數中聲明的變量，會成為函數的局部變量。

局部變量只能在函數內訪問。

實例

// 此處的代碼不能使用 carName
function myFunction() {
    var carName = "Volvo";
    // 此處的代碼可以使用 carName
}
// 此處的代碼不能使用 carName

親自試一試

由于局部變量只能被其函數識別，因此可以在不同函數中使用相同名稱的變量。

局部變量在函數開始時創建，在函數完成時被刪除。

課外書

如需更多有關 JavaScript 函數的知識，請閱讀 JavaScript 高級教程中的相關內容：

ECMAScript 函數概述
本節講解函數的概念，ECMAScript 如何聲明并調用函數，以及函數如何返回值。
ECMAScript arguments 對象
本節介紹了此對象的基本用法，然后講解了如何使用 length 屬性來測定函數的參數數目，以及模擬函數重載。
ECMAScript Function 對象（類）
本節講解了如何使用 Function 類創建函數，然后介紹了 Function 對象的屬性和方法。
ECMAScript 閉包（closure）
本節講解了閉包（closure）的概念，并分別為您展示了簡單和稍復雜的兩個閉包實例。