JavaScript（三）

函數

函數就是重覆執行的代碼片。

函數定義與執行

<script type="text/javascript">
    // 函數定義
    function aa(){
        alert('hello!');
    }
    // 函數執行
    aa();
</script>

變數與函數預解析 
JavaScript解析過程分為兩個階段，先是編譯階段，然後執行階段，在編譯階段會將function定義的函數提前，並且將var定義的變數聲明提前，將它賦值為undefined。

<script type="text/javascript">    
    aa();       // 彈出 hello！
    alert(bb);  // 彈出 undefined
    function aa(){
        alert('hello!');
    }
    var bb = 123;
</script>

提取行間事件 
在html行間調用的事件可以提取到javascript中調用，從而做到結構與行為分離。

<!--行間事件調用函數   -->
<script type="text/javascript">        
    function myalert(){
        alert('ok!');
    }
</script>
......
<input type="button" name="" value="彈出" onclick="myalert()">

<!-- 提取行間事件 -->
<script type="text/javascript">

window.onload = function(){
    var oBtn = document.getElementById('btn1');
    oBtn.onclick = myalert;
    function myalert(){
        alert('ok!');
    }
}    
</script>
......
<input type="button" name="" value="彈出" id="btn1">

匿名函數

定義的函數可以不給名稱，這個叫做匿名函數，可以將匿名函數直接賦值給元素綁定的事件來完成匿名函數的調用。

<script type="text/javascript">

window.onload = function(){
    var oBtn = document.getElementById('btn1');
    /*
    oBtn.onclick = myalert;
    function myalert(){
        alert('ok!');
    }
    */
    // 直接將匿名函數賦值給綁定的事件

    oBtn.onclick = function (){
        alert('ok!');
    }
}

</script>

函數傳參

<script type="text/javascript">
    function myalert(a){
        alert(a);
    }
    myalert(12345);
</script>

函數'return'關鍵字 
函數中'return'關鍵字的作用：
1、返回函數執行的結果
2、結束函數的運行
3、阻止預設行為

<script type="text/javascript">
function add(a,b){
    var c = a + b;
    return c;
    alert('here!');
}

var d = add(3,4);
alert(d);  //彈出7
</script>