JavaScript 函數(shù)
函數(shù)是由事件驅(qū)動的或者當(dāng)它被調(diào)用時執(zhí)行的可重復(fù)使用的代碼塊。
實例
<!DOCTYPE html> <html> <head> <script> function myFunction() { alert("Hello World!"); } </script> </head> <body> <button onclick="myFunction()">點擊這里</button> </body> </html>
JavaScript 函數(shù)語法
函數(shù)就是包裹在花括號中的代碼塊,前面使用了關(guān)鍵詞 function:
function functionname() { 這里是要執(zhí)行的代碼 }
當(dāng)調(diào)用該函數(shù)時,會執(zhí)行函數(shù)內(nèi)的代碼。
可以在某事件發(fā)生時直接調(diào)用函數(shù)(比如當(dāng)用戶點擊按鈕時),并且可由 JavaScript 在任何位置進(jìn)行調(diào)用。
提示:JavaScript 對大小寫敏感。關(guān)鍵詞 function 必須是小寫的,并且必須以與函數(shù)名稱相同的大小寫來調(diào)用函數(shù)。
調(diào)用帶參數(shù)的函數(shù)
在調(diào)用函數(shù)時,您可以向其傳遞值,這些值被稱為參數(shù)。
這些參數(shù)可以在函數(shù)中使用。
您可以發(fā)送任意多的參數(shù),由逗號 (,) 分隔:
myFunction(argument1,argument2)
當(dāng)您聲明函數(shù)時,請把參數(shù)作為變量來聲明:
function myFunction(var1
,var2
) { 這里是要執(zhí)行的代碼 }
變量和參數(shù)必須以一致的順序出現(xiàn)。第一個變量就是第一個被傳遞的參數(shù)的給定的值,以此類推。
實例
<button onclick="myFunction('Bill Gates','CEO')">點擊這里</button> <script> function myFunction(name,job) { alert("Welcome " +name
+ ", the " +job
); } </script>
上面的函數(shù)會當(dāng)按鈕被點擊時提示 "Welcome Bill Gates, the CEO"。
函數(shù)很靈活,您可以使用不同的參數(shù)來調(diào)用該函數(shù),這樣就會給出不同的消息:
實例
<button onclick="myFunction('Harry Potter','Wizard')">點擊這里</button> <button onclick="myFunction('Bob','Builder')">點擊這里</button>
根據(jù)您點擊的不同的按鈕,上面的例子會提示 "Welcome Harry Potter, the Wizard" 或 "Welcome Bob, the Builder"。
帶有返回值的函數(shù)
有時,我們會希望函數(shù)將值返回調(diào)用它的地方。
通過使用 return 語句就可以實現(xiàn)。
在使用 return 語句時,函數(shù)會停止執(zhí)行,并返回指定的值。
語法
function myFunction()
{
var x=5;
return x;
}
上面的函數(shù)會返回值 5。
注釋:整個 JavaScript 并不會停止執(zhí)行,僅僅是函數(shù)。JavaScript 將繼續(xù)執(zhí)行代碼,從調(diào)用函數(shù)的地方。
函數(shù)調(diào)用將被返回值取代:
var myVar=myFunction();
myVar 變量的值是 5,也就是函數(shù) "myFunction()" 所返回的值。
即使不把它保存為變量,您也可以使用返回值:
document.getElementById("demo").innerHTML=myFunction();
"demo" 元素的 innerHTML 將成為 5,也就是函數(shù) "myFunction()" 所返回的值。
您可以使返回值基于傳遞到函數(shù)中的參數(shù):
實例
計算兩個數(shù)字的乘積,并返回結(jié)果:
function myFunction(a,b) { return a*b; } document.getElementById("demo").innerHTML=myFunction(4,3);
"demo" 元素的 innerHTML 將是:
12
在您僅僅希望退出函數(shù)時 ,也可使用 return 語句。返回值是可選的:
function myFunction(a,b) { if (a>b) { return; } x=a+b }
如果 a 大于 b,則上面的代碼將退出函數(shù),并不會計算 a 和 b 的總和。
局部 JavaScript 變量
在 JavaScript 函數(shù)內(nèi)部聲明的變量(使用 var)是局部變量,所以只能在函數(shù)內(nèi)部訪問它。(該變量的作用域是局部的)。
您可以在不同的函數(shù)中使用名稱相同的局部變量,因為只有聲明過該變量的函數(shù)才能識別出該變量。
只要函數(shù)運行完畢,本地變量就會被刪除。
全局 JavaScript 變量
在函數(shù)外聲明的變量是全局變量,網(wǎng)頁上的所有腳本和函數(shù)都能訪問它。
JavaScript 變量的生存期
JavaScript 變量的生命期從它們被聲明的時間開始。
局部變量會在函數(shù)運行以后被刪除。
全局變量會在頁面關(guān)閉后被刪除。
向未聲明的 JavaScript 變量來分配值
如果您把值賦給尚未聲明的變量,該變量將被自動作為全局變量聲明。
這條語句:
carname="Volvo";
將聲明一個全局變量 carname,即使它在函數(shù)內(nèi)執(zhí)行。
課外書
如需更多有關(guān) JavaScript 函數(shù)的知識,請閱讀 JavaScript 高級教程中的相關(guān)內(nèi)容:
- ECMAScript 函數(shù)概述
- 本節(jié)講解函數(shù)的概念,ECMAScript 如何聲明并調(diào)用函數(shù),以及函數(shù)如何返回值。
- ECMAScript arguments 對象
- 本節(jié)介紹了此對象的基本用法,然后講解了如何使用 length 屬性來測定函數(shù)的參數(shù)數(shù)目,以及模擬函數(shù)重載。
- ECMAScript Function 對象(類)
- 本節(jié)講解了如何使用 Function 類創(chuàng)建函數(shù),然后介紹了 Function 對象的屬性和方法。
- ECMAScript 閉包(closure)
- 本節(jié)講解了閉包(closure)的概念,并分別為您展示了簡單和稍復(fù)雜的兩個閉包實例。