JavaScript學習總結(七)——JavaScript函數(function)

一、函數基本概念

　　為完成某一功能的程序指令(語句)的集合，稱為函數。

二、JavaScript函數的分類

　　1、自定義函數(我們自己編寫的函數)，如：function funName(){}

　　2、系統函數(JavaScript自帶的函數)，如alert函數。

三、函數的調用方式

　　1、普通調用：functionName(實際參數...)

　　2、通過指向函數的變量去調用：

　　　　　　var myVar=函數名;

　　　　　　myVar(實際參數...);

四、函數返回值

　　1.當函數無明確返回值時，返回的值就是"undefined"。

　　2.當函數有返回值時，返回值是什么就返回什么。

函數測試代碼：

 <script type="text/javascript">
    var str="window.alert('孤傲蒼狼');";
    eval(str);//eval() 函數可計算某個字符串，並執行其中的的 JavaScript 代碼。
    /*自定義函數*/
    function test(str){
        alert(str);
    }
    window.alert(test);//輸出test函數的定義
    //函數的調用方式1
    test("孤傲蒼狼");
    //函數的調用方式2
    var myFunction=test;
    myFunction("白虎神皇");
    window.alert(myFunction);
    /*當函數無明確返回值時，返回的也是值 "undefined"*/
    var retVal=test("test");//test函數執行完之后，並沒有返回值，因此retVal變量接收到的返回值結果是undefined
    alert("retVal="+retVal);//輸出undefined
  </script>

 五、函數的深入使用

5.1、可變參數

　　函數的參數列表可以是任意多個，並且數據類型可以是任意的類型，JavaScript的函數天然支持可變參數，JavaScript有一個arguments變量可以訪問所有傳到函數內部的參數。

范例：JavaScript使用arguments創建參數可變的函數

<script type="text/javascript">
    /*add函數是一個參數可變的函數*/
    function add(){
        var result=0;
        for(var i=0;i<arguments.length;i++){
            //alert(arguments[i]);
            result+=arguments[i];
        }

        return result;
    }
    alert("add(1,2,3)="+add(1,2,3));//調用add函數時傳入3個參數
    alert("add(1,2,3,4,5,6)="+add(1,2,3,4,5,6));//調用add函數時傳入6個參數
    alert("add()="+add());//調用add函數時不傳入參數
    alert("add(1,\"HelloWorld\")="+add(1,"HelloWorld"));//調用add函數時傳入不同類型的參數
  </script>

運行結果：

5.2、javascript創建動態函數

　　JavaScript支持創建動態函數，動態函數必須用Function對象來定義（Function是javascript中的一個對象，是固定不變的，規定Function對象的"F"必須大寫，當是function的時候，我們知道是定義函數的時候所使用的一個關鍵字：function funName(x，y)，當是Function的時候（F大寫的時候），我們知道是javascript中的對象）

　　創建動態函數的基本格式：var 變量名 = new Function("參數1"，"參數2"，"參數n"，"執行語句");

　　使用new關鍵字（new是javascript中一個關鍵字，也是固定的，我們在定義動態函數的時候必須要使用new來創建這個Function對象）

　　我們先定義一個變量： var 變量名，在這里，變量名是隨便的，然后我們再使用new關鍵字創建一個Function對象，然后再把這個對象賦值給這個任意的變量，也就是：var 變量名 = new Function("參數1"，"參數2"，"參數n"，"執行語句");Function后面的括號里先是傳遞給函數的參數，然后用一個逗號（，）隔開然后是這個函數要執行的功能的代碼

看下面的一段代碼：

<script type="text/javascript">
    var square = new Function ("x","y","var sum ; sum = x+y;return sum;");
    alert("square(2,3)的結果是："+square(2,3));
  </script>

　　square是動態創建的函數，在Function對象后面的括號里的每一部分內容都必須是字符串形式的，也就是說都必須用引號（""或者是''）括起來，第一部分是傳遞給這個動態函數的第一個參數“x”，第二部分是傳遞給這個動態函數的第二個參數“y“，第三部分是這個函數要完成的功能的代碼，這個函數要完成的功能是定義一個變量sum，讓sum等於傳遞給這個函數的兩個參數x和y的和，然后返回他們相加以后的值（return sum），調用后運行結果如下：

　　

這段代碼：

var square = new Function ("x","y","var sum ; sum = x+y;return sum;");

和下面這段代碼：

function square (x,y){
     var sum;
     sum = x+y;
     return sum;
}

是一摸一樣的，只不過一個是動態函數，一個是靜態函數。

那下面我們就來想一下，為什么要用動態函數呢，動態函數有什么特殊的地方有什么優點呢？

在靜態函數里是：

function square (x,y){
      var sum;
      sum = x+y;
      return sum;
}

而在動態函數里是：

new Function ("x","y","var sum ; sum = x+y;return sum;");

　　我們可以看到，每一個句子兩邊都加上了引號"x"還有"y"還有"var sum ; sum = x+y;; return sum;"這些兩邊都加上了引號，也就是說在new Function后面的小括號里面的每一個語句兩邊都是有引號的，也就是說他們都是以字符串的形式表示和被調用的，而字符串又是可以由變量來定義或者是改變的，也就是說，我們可以定義變量，讓變量的值等於這些字符串：

<script type="text/javascript">
    var a = "var sum;";
    var b = "sum = x + y;";
    var c = "return sum;";
    var square = new Function ( "x", "y", a+b+c);
    alert(square (2,3));7 </script>

　　在這里，我們定義了變量a，b，c，我們讓a="var sum;"，讓b="sum = x+y;"，讓c = "return sum;"

　　這樣：var square = new Function ("x","y","var sum ; sum = x+y;return sum;");

　　我們就可以寫成：var square = new Function ( " x", "y",a+b+c);因為a，b，c是三個字符串，字符串相加得到的還是字符串。

　　我們為什么要把代碼分成一小段一小段的代碼呢？，把一個字符串分成了若干個獨立的字符串的優點就在於我們可以通過修改其中的某些字符串來隨時改變函數的作用。

例如：

<script type="text/javascript">
    var a = "var sum;";
    var b = "sum = x + y;";
    var c = "return sum;";
    var square = new Function ( "x", "y", a+b+c);
    alert(square (2,3));
    b = "sum = x -y;";
    square = new Function ( " x", "y",a+b+c);
    alert(square (2,3));
 </script>

　　我們在程序運行的過程中，把b = "sum = x+y;";改成了"sum = x-y;";這樣我們再把修改了值以后的變量b，放到var square = new Function ( "x", "y", a+b+c);中，

那("x","y","var sum ; sum = x+y;return sum;");就變成了：("x","y","var sum ; sum = x - y;return sum;");我們把傳遞給這個動態函數的參數2和3放進去，就變成了2-3，結果是-1。

5.3、匿名函數

var f1 = function(i1, i2) {
     return i1 + i2;
}
alert(f1(1,2));

　　這種匿名函數的用法在JQuery中的非常多

alert(function(i1, i2) { return i1 + i2; }(10,10));

　　直接聲明一個匿名函數，立即使用。用匿名函數的好處就是省得定義一個用一次就不用的函數，而且免了命名沖突的問題，js中沒有命名空間的概念，因此很容易函數名字沖突，一旦命名沖突以最后聲明的為准。

5.4、JavaScript不支持函數的重載

　　JavaScript沒有方法重載的說法，如果兩個方法名字一樣，即使參數個數不一樣，那么后面定義的就會覆蓋前面定義，調用方法時永遠是調用后定義的那個。

用如下的代碼證明JavaScript不支持函數的重載：

 <script type="text/javascript">
    function Test(a){
        alert(a);
    }
    function Test(a,b){
        alert("HelloWorld!");
    }
    function Test(a,b){
        alert(a+" "+b);
    }

    Test(20);//調用的是最后定義的那個Test方法
    Test(30,50);//調用的是最后定義的那個Test方法
</script>

運行結果：

　　

　　JS引擎調用一個函數時，是根據函數名來調用的，如果有多個函數名相同的函數，那么JS引擎則只認最后定義的那個，調用時以最后定義的那個函數為准！

　　JS的函數沒有專門的函數默認值的語法，但是可以不給參數傳值，不傳值的參數值就是undefined。