Latest web development tutorials
×

JavaScript 教程

JavaScript 教程 JavaScript 簡介 JavaScript 用法 JavaScript 輸出 JavaScript 語法 JavaScript 語句 JavaScript 註釋 JavaScript 變量 JavaScript 數據類型 JavaScript 對象 JavaScript 函數 JavaScript 作用域 JavaScript 事件 JavaScript 字符串 JavaScript 運算符 JavaScript 比較 JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript 類型轉換 JavaScript 正則表達式 JavaScript 錯誤 JavaScript 調試 JavaScript 變量提升 JavaScript 嚴格模式 JavaScript 使用誤區 JavaScript 表單驗證 JavaScript 保留關鍵字 JavaScript JSON JavaScript void JavaScript 代碼規範

JS 函數

JavaScript 函數定義 JavaScript 函數參數 JavaScript 函數調用 JavaScript 閉包

JS HTML DOM

DOM 簡介 DOM HTML DOM CSS DOM 事件 DOM EventListener DOM 元素

JS 高級教程

JavaScript 對象 JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp 對象

JS 瀏覽器 BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript 彈窗 JavaScript 計時事件 JavaScript Cookies

JS 庫

JavaScript 庫 JavaScript 測試 jQuery JavaScript 測試 Prototype

JS 實例

JavaScript 實例 JavaScript 對象實例 JavaScript 瀏覽器對象實例 JavaScript HTML DOM 實例 JavaScript 總結

JS 參考手冊

JavaScript 對象 HTML DOM 對象

JavaScript 函數

函數是由事件驅動的或者當它被調用時執行的可重複使用的代碼塊。

實例

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}

</script>
</head>

<body>
<button onclick=" myFunction() ">Try it</button>
</body>
</html>


JavaScript 函數語法

函數就是包裹在花括號中的代碼塊,前面使用了關鍵詞function:

functionfunctionname()
{
执行代码
}

當調用該函數時,會執行函數內的代碼。

可以在某事件發生時直接調用函數(比如當用戶點擊按鈕時),並且可由JavaScript 在任何位置進行調用。

lamp JavaScript 對大小寫敏感。 關鍵詞function 必須是小寫的,並且必須以與函數名稱相同的大小寫來調用函數。


調用帶參數的函數

在調用函數時,您可以向其傳遞值,這些值被稱為參數。

這些參數可以在函數中使用。

您可以發送任意多的參數,由逗號(,) 分隔:

myFunction(argument1,argument2)

當您聲明函數時,請把參數作為變量來聲明:

function myFunction( var1 , var2 )
{
代码
}

變量和參數必須以一致的順序出現。 第一個變量就是第一個被傳遞的參數的給定的值,以此類推。

實例

<button onclick="myFunction( 'Harry Potter' , 'Wizard' )">Try it</button>

<script>
function myFunction( name , job )
{
alert("Welcome " + name + ", the " + job );
}
</script>

嘗試一下»

上面的函數在按鈕被點擊時會提示"Welcome Harry Potter, the Wizard"。

函數很靈活,您可以使用不同的參數來調用該函數,這樣就會給出不同的消息:

實例

<button onclick="myFunction( 'Harry Potter' , 'Wizard' )">Try it</button>
<button onclick="myFunction( 'Bob' , 'Builder' )">Try it</button>

嘗試一下»

根據您點擊的不同的按鈕,上面的例子會提示"Welcome Harry Potter, the Wizard" 或"Welcome Bob, the Builder"。


帶有返回值的函數

有時,我們會希望函數將值返回調用它的地方。

通過使用return 語句就可以實現。

在使用return 語句時,函數會停止執行,並返回指定的值。

語法

function myFunction()
{
    var x=5;
    return x;
}

上面的函數會返回值5。

注意:整個JavaScript並不會停止執行,僅僅是函數。 JavaScript 將繼續執行代碼,從調用函數的地方。

函數調用將被返回值取代:

var myVar=myFunction();

myVar 變量的值是5,也就是函數"myFunction()" 所返回的值。

即使不把它保存為變量,您也可以使用返回值:

document.getElementById("demo").innerHTML=myFunction();

"demo" 元素的innerHTML 將成為5,也就是函數"myFunction()" 所返回的值。

您可以使返回值基於傳遞到函數中的參數:

實例

計算兩個數字的乘積,並返回結果:

function myFunction(a,b)
{
return a*b;
}

document.getElementById("demo").innerHTML=myFunction(4,3);

"demo" 元素的innerHTML 將是:

12

嘗試一下»

在您僅僅希望退出函數時,也可使用return 語句。 返回值是可選的:

function myFunction(a,b)
{
	if (a>b)
	{
		return;
	}
	x=a+b
}

如果a 大於b,則上面的代碼將退出函數,並不會計算a 和b 的總和。


局部JavaScript 變量

在JavaScript函數內部聲明的變量(使用var)是局部變量,所以只能在函數內部訪問它。 (該變量的作用域是局部的)。

您可以在不同的函數中使用名稱相同的局部變量,因為只有聲明過該變量的函數才能識別出該變量。

只要函數運行完畢,本地變量就會被刪除。


全局JavaScript 變量

在函數外聲明的變量是全局變量,網頁上的所有腳本和函數都能訪問它。


JavaScript 變量的生存期

JavaScript 變量的生命期從它們被聲明的時間開始。

局部變量會在函數運行以後被刪除。

全局變量會在頁面關閉後被刪除。


向未聲明的JavaScript 變量分配值

如果您把值賦給尚未聲明的變量,該變量將被自動作為全局變量聲明。

這條語句:

carname="Volvo";

將聲明一個全局變量carname,即使它在函數內執行。