JavaScript中的函數，JavaScript函數
前言
很多情況下，程式在執行過程中會反覆完成相同或類似的任務，為了避免多次重複編寫相同的程式碼片段，
JavaScript把部分程式碼封裝裝為能夠重複使用的模組，稱為“函數”。函數可以在程式的其他部分使用，就像它是
JavaScript語言的組成部分一樣。
使用函數可以讓代碼更加易讀和維護。函數是JavaScript的基本模組之一，幾乎會出現在每個指令碼中。
建立函數就好像是建立一個新的JavaScript命令，能夠在指令碼的其他部分使用。建立函數可以使用關鍵字
funcition，接著是函數的名稱，後面緊跟一對圓括弧，然後是一對花括弧。花括弧裡面是構成函數的JavaScript語
句，如以下範例：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><body> <script> function showAlert(){ alert("Hello JavaScript") } </script></body></html>
在頁面載入時，包含在函數定義地區內的代碼不會被執行，而是在被調用時執行，調用函數只需要使用函數名
稱，就可以在需要的地方執行函數的代碼，如以下範例：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><body><script> function showAlert(){ alert("Hello JavaScript") }</script><input type="button" value="Show Alert" onclick="showAlert()"/></body></html>
顯示的效果如下：
到目前為止，我們的範例都把JavaScript代碼放置到HTML頁面的<body>地區。為了更好地發揮函數的作用，我
們要採取更適當的方式，也就是把JavaScript代碼放置到頁面的<head>地區。當函數位於頁面<head>地區的<script>
元素裡，或是位於頁面<head>地區的<script>元素的src屬性所指向的外部檔案時，它就可以從頁面的任何位置被調
用。把函數放到文檔的head部分能夠確保它們被調用之前已經被定義了。如以下範例：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <script> function showAlert(){ alert("Hello JavaScript") } </script></head><body><input type="button" value="Show Alert" onclick="showAlert()"/></body></html>
如果函數只是像前面範例中那樣在每次調用時只能實現完成相同的操作，那麼其應用就會受到很大的局限。好在
我們可以通過向函數傳遞資料來擴充函數的功能，其實現方法在調用函數時給它傳遞一個或多個”參數“。如以下範
例：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <script> function sum(a,b){ alert(a+b); } </script></head><body> <input type="button" value="ADD" onclick="sum(2,6)"/></body></html>
我們通過傳遞兩個參數，通過alert來顯示兩數相加的結果。
效果如下：
前面範例展示了如何向函數傳遞參數，讓函數來對這些資料進行處理，那麼，如何從函數獲得資料呢？畢竟，我
們不能只通過彈出對話方塊來獲得函數的結果。從函數返回資料，我們可以使用關鍵字return。如以下範例：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <script> function sum(a,b){ var num=a+b; return num; } </script></head><body> <input type="button" value="ADD" onclick="document.write(sum(2,6))"/></body></html>
以上通過onClick點擊事件調用了函數sum,並傳入兩個參數，函數sum通過return返回兩數的和，並通過document對象
的write方法向頁面輸出資料。（var關鍵字是用於聲明變數的）
效果如下：
-------------------------------------------------------------------------------------------------------------------------------------------------------
轉載請註明出處：http://blog.csdn.net/hai_qing_xu_kong/article/details/48207901情緒控
著作權聲明：本文為博主原創文章，未經博主允許不得轉載。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
