DIV CSS 佈局教程網

4.1 函數是什麼?
編輯:JavaScript基礎知識     

一、JavaScript函數簡介

很多教程書一上來就講解一堆語法,例如函數定義、函數調用什麼。等讀者看完了函數這一章都沒搞懂什麼是函數。

在講解什麼叫函數之前,我們先看下面一段代碼:

 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var sum=0;
        for(var i=1;i<50;i+=2)
        {
            sum+=i;
        }
        document.write("50以內所有奇數和為:"+sum);
    </script>
</head>
<body>
</body>
</html>

大家一看就知道了,上面代碼實現的是50以內所有奇數的和。如果要分別計算50以內所有奇數和以及100以內所有奇數和,那讀者該怎麼實現。很多人很快就寫了以下代碼:

 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var sum1=0;
        for(var i=1;i<50;i+=2)
        {
            sum1+=i;
        }
        document.write("50以內所有奇數和為:"+sum1);
        document.write("<br/>");
        var sum2=0;
        for(var j=1;j<100;j+=2)
        {
            sum2+=j;
        }
        document.write("100以內所有奇數和為:"+sum2);
    </script>
</head>
<body>
</body>
</html>

那我現在問一個問題,如果我要你實現50以內所有奇數和、100以內所有奇數和、150以內奇數和、200以內所有奇數和、250以內所有奇數和。那你豈不是要每次都重復編寫次類似的代碼?要是沒有一種簡單的實現方法,俺們這些程序猿還用活的?

為了解決減輕這種重復編碼的負擔,函數這種東西就應運而生。例如實現上面5個范圍以內的實現方式如下:

在線測試
 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        //定義函數
        function sum(n)
        {
            var m=0;
            for(var i=1;i<n;i+=2)
            {
                m+=i;
            }
            document.write(n+"以內所有奇數和為:"+m+"<br/>");
        }
        //調用函數,計算50以內所有奇數的和
        sum(50);
        //調用函數,計算100以內所有奇數的和
        sum(100);
        //調用函數,計算150以內所有奇數的和
        sum(150);
        //調用函數,計算200以內所有奇數的和
        sum(200);
        //調用函數,計算250以內所有奇數的和
        sum(250);
    </script>
</head>
<body>
</body>
</html>

在浏覽器預覽效果如下:

大家可以看到使用函數可以減少大量重復工作,而函數只需要采用簡單2步就可以實現了:

  • (1)定義函數;
  • (2)調用函數;

現在大家都知道函數是怎麼一回事了,我們來總結一下:函數,就是一個一系列JavaScript語句的集合,這是為了完成某一個會重復使用的特定功能。在需要該功能的時候,直接調用函數即可,而不必每次都編寫一大堆重復的代碼。並且在需要修改該功能的時候,也只要修改和維護這一個函數即可。

總之,將語句集合成函數,好處就是方便代碼重用。並且,一個好的函數名,可以讓人一眼就知道這個函數實現的是什麼功能,方便維護。

在接下來的課程中,我們來給大家詳細講解編程的一大利器——函數。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved