JavaScript 函數

什麼是函數?

函數是一組可重複使用的程式碼區塊,在 JavaScript 中,函數由事件驅動或被其他程式碼呼叫。

函數是JavaScript 語言的核心之一,基本語法如下:

function functionName(arg0, arg1, ...) {
   statements
}

語法解讀

使用function 關鍵字定義一個函數

function 關鍵字空格之後緊跟著函數名稱

函數名字後面是一對小括弧,arg0, arg1 表示函數的參數,參數之間以, 號分隔,參數個數可以為0-25 個(0即表示無參數)。在沒有參數時,() 括號不可省略,超過25個的參數,將被JavaScript忽略

{} 是函數體,裡面是函數要實現的函數語句

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
function hello(name){
    document.write(name + ",你好!");
}
</script>
</head>
<body>
  <input type="button" onclick="hello('小明')" value="确定" />
</body>
</html>

#JavaScript 函數命名

通常,我們推薦函數的名字使用小駝峰命名法,並以函數名能大致描述該函數函數或特性為宜。小駝峰法是指,首字小寫,後面其他字的首字母大寫,下面是一些函數命名範例:

function changeName(){
   ...
}
function getAgeByInput(){
   ...
}

也有不少人使用底線來分割函數名稱中的單詞,如change_name,這也是可以的,實際執行可依具體項目規範。

特別地,函數前加 _ 符號(如 _getName),一般約定俗成表示類別(物件)的私有方法。

JavaScript 函數內的變數

如果一個變數在函數體內被聲明,則只能在該函數中存取該變數。這樣,您可以在不同的函數內使用名稱相同的變數。

如果在函數之外宣告了一個變量,則 Web 頁面上的所有函數都可以存取該變數。

JavaScript 函數參數

JavaScript 函數允許沒有參數(但包含參數的小括號不能省略),也可以傳遞參數給函數給函數使用。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
function hello(name,age){
    document.write("我叫" + name + ",今年" + age + "岁!");
}
</script>
</head>
<body>
  <input type="button" onclick="hello('小明',18)" value="确定" />
</body>
</html>

運行該例子,點擊 確定 按鈕,輸出:

我叫小明,今年18歲!

如上例所示,傳入的值是字串時,需要加上引號;傳入的值是數字,不需要加引號。

JavaScript 函數參數錯誤

JavaScript 函數參數並沒有嚴格要求哪些參數是必選參數,哪些參數是可選參數,因此傳入的參數個數是允許不等於定義函數時參數的個數的。

如果函數中使用了未定義的參數,則會提示語法錯誤(參數未定義),JavaScript 程式碼不會正常運作。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
function hello(name,age){
    document.write("我叫" + name + ",今年" + age + "岁!");
}
</script>
</head>
<body>
  <input type="button" onclick="hello('小明')" value="确定" />
</body>
</html>

運行該例子,點擊 確定 按鈕,輸出:

我叫小明,今年undefined歲!

JavaScript 函數 return

#JavaScript 函數的 return 語句用來規定從函數傳回的值。當一個函數運行後,要得到一個運行結果,就需要使用 return 語句來傳回該結果。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
function sum(x,y){
    return x+y;
}
result = sum(2,3);
document.write( result );
</script>
</head>
<body>
</body>
</html>

執行此範例輸出:5

#無回傳值的return 語句

如果函數沒有傳回值,那麼可以呼叫沒有參數的return 運算符,隨時退出函數:

<script type="text/javascript">
function sum(x,y){
   if( x<y ){
       return;
   }else{
return x-y;
   }
}
<#script>


##################ch;##################################ch;#########################4;##################################4;#########################4;#######n; ###########################局部JavaScript 變數######

在 JavaScript 函數內部宣告的變數(使用 var)是局部變量,所以只能在函數內部存取它。 (此變數的作用域是局部的)。

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

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


全域JavaScript 變數

#在函數外宣告的變數是全域變量,網頁上的所有腳本和函數都能訪問它。


JavaScript 變數的生存期間

#JavaScript 變數的生命期從它們被宣告的時間開始。

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

全域變數會在頁面關閉後被刪除。


向未宣告的JavaScript 變數指派值

如果您將值賦給尚未宣告的變數,則該變數將會被自動作為全域變數聲明。

這條語句:

carname="Volvo";

將宣告一個全域變數 carname,即使它在函數內執行。



繼續學習
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function hello(name,age){ document.write("我叫" + name + ",今年" + age + "岁!"); } </script> </head> <body> <input type="button" onclick="hello('小明',18)" value="确定" /> </body> </html>