27.函數function

什麼是函數？
個人理解：函數是一段被封裝的代碼，想用就用，不用也不會被執行，也不會有影響其它代碼的運行

函數有兩個階段：代碼的封裝和函數的調用

函數定義

函數定義：聲明式、賦值式函數表達式和函數構造法三種

聲明式

• 使用funtion關鍵字來聲明行數
• 語法：

function fn(){
	//代碼塊
}
/*
function: 聲明函數的關鍵字，表示接下來是一個函數了 
fn:函數的名字（必須遵守命名規則和命名規範）
():必須寫，用來放形參
{}:裏面存放代碼塊
*/

賦值式函數表達式
賦值式函數表達式也叫函數字面量
賦值式函數表達就是聲明一個變量接收右邊的匿名函數

var fn=function(){
	//代碼塊
}

函數構造法（這裏先了解一下）
函數構造法通過new實例化一個涵數

var fn=new Function();

函數調用
三種函數定義方式不同，但調用函數的的方式是一樣的

調用一個函數：直接寫 函數名() 就可以了

//聲明式函數
//fn(); 可以寫在函數前面調用
function fn(){
	console.log("我是fn函數");
}
//調用 括號必須寫
fn();

//賦值式函數表達式（函數字面量）
var fn2 = function(){
	console.log("我是fn函數");
}
//調用
fn2();//注意：fn2()不能卸載聲明的前面，寫在前面會報錯:fn2 is not a function，後面js預解析的時候會講原因

注意：函數定義完成後沒有調用，則函數裏面的代碼不會被執行
函數可以被調用多次

聲明式和賦值式函數表達式的區別
區別上面有講，就是函數的調用
聲明式函數的調用可以在函數定義前和函數定義後調用
賦值式函數表達式只能只函數定義後調用，如果在函數定義前面定義會報錯

函數的參數

• 定義函數和調用函數時都有些(),接下來講括號的作用
• ()是用來放參數的
• 參數非爲兩種:形參和實參

//聲明式
function fn(形參些這裏){
	//代碼塊
}
fn(實參寫這裏)

//賦值式函數表達式

var fn2=function(形參些這裏){
	//代碼塊
}
fn2(實參寫這裏)

行參和實參的作

形參

• 形參只能在函數內部使用，不能再外部使用
• 形參只在當前函數可以使用，再別的函數裏面不可以使用，如果和別的函數內的形參名字一樣，沒有什麼影響
• 形參可以有多個，通過‘,’(逗號)好分隔

//書寫一個參數
//聲明式
function fn(num){
	//代碼塊
}
//賦值式函數表達式
var fn2=function(num){
	//代碼塊
}

//書寫兩個參數
//聲明式
function fn(num1,num2){
	//代碼塊
}
//賦值式函數表達式
var fn2=function(num1,num2){
	//代碼塊
}

實參

• 在函數調用的時候給行參賦值的
• 在調用的時候是給一個實際的內容

function fn(num) {  // 函數內部可以使用 num }
 
// 這個函數的本次調用，書寫的實參是 100 
// 那麼本次調用的時候函數內部的 num 就是 100 
fn(100) 
 
// 這個函數的本次調用，書寫的實參是 200 
// 那麼本次調用的時候函數內部的 num 就是 200 
fn(200)

注:

1. 如果只有形參，再調用的時候沒有傳實參，則函數裏面的形參值是undefined
2. 形參的值是在函數調用的時候由實參決定的
3. 函數內部的形參的值，由函數調用的時候傳遞的實參決定
4. 多個參數的時候，是按照順序一一對應的

function fn(num1, num2) {  
// 函數內部可以使用 num1 和 num2 
}
 
// 函數本次調用的時候，書寫的參數是 100 和 200 
// 那麼本次調用的時候，函數內部的 num1 就是 100，num2 就是 200 fn(100, 200)

參數個數的關係

1. 行參比實參少
   因爲是按照順序一一對應的
   行參少就會拿不到實參給的值，所以在函數內部就沒有辦法用到這個值

function fn(num1, num2) {  
// 函數內部可以使用 num1 和 num2 
}
 
// 本次調用的時候，傳遞了兩個實參，100 200 和 300 
// 100 對應了 num1，200 對應了 num2，300 沒有對應的變量 
// 所以在函數內部就沒有辦法依靠變量來使用 300 這個值 
fn(100, 200, 300)

2. 行參比實參多
   因爲是按照順序一一對應的
   所以多出來的行參就是沒有值的，就是 undefined

function fn(num1, num2, num3) {  
// 函數內部可以使用 num1 num2 和 num3 
}
 
// 本次調用的時候，傳遞了兩個實參，100 和 200 
// 就分別對應了 num1 和 num2 
// 而 num3 沒有實參和其對應，那麼 num3 的值就是 undefined 
fn(100, 200)

arguments
arguments 對象是所有（非箭頭）函數中都可用的局部變量
可以使用 arguments 對象在函數中引用函數的參 數。此對象包含傳遞給函數的每個參數，第一個參數在索引0處。例如，如果一個函數傳遞了三個參數，可以以 如下方式引用他們

arguments[0] 
arguments[1] 
arguments[2] 
//參數也可以被設置： 
arguments[1] = 'new value';
 

arguments 對象不是一個 Array 。它類似於 Array ，但除了length屬性和索引元素之外沒有任何 Array 屬性。
可以借用arguments.length可以來查看實參和形參的個數是否一致

練習

<style>
        table {
            border: 5px solid red;
            border-collapse: collapse;
        }
        
        table td {
            width: 50px;
            height: 20px;
            border: 5px solid red;
        }
    </style>
 <script>
// 通過函數創建表格,參數是行和列
//h是行 l是列   
function createTable(h, l) {
    document.write("<table>")
    for (var i = 0; i < h; i++) {
        document.write("<tr>")
        for (var j = 0; j < l; j++) {
            document.write("<td></td>")
        }
        document.write("</tr>")
    }
    document.write("</table>")
}
createTable(4, 10)//生成4行10列的表格


/* 
*編寫一個函數，計算任意兩個數字之間所能組成的奇數個數，數字必須是個位數
*比如： 計算0-3之間能組成的奇數個是01、03、11、13、21、23、31、33
*/
function getNum(n1, n2) {
     if (n1 > 9 || n1 < 0 || n2 > 9 || n2 < 0) {
         alert("數字必須輸入0-9之間");
         return;
     }
     for (var i = n1; i <= n2; i++) {
         for (var j = n1; j <= n2; j++) {
             var temp = '' + i + j;
             // console.log(temp);
             if (temp % 2 != 0 && j != 0) {
                 console.log(temp);
             }
         }
     }
 }
  getNum(0, 3)
    </script>

**返回值 return **
return在函數內有兩個作用:
1.返回函數的結果
2.終止函數裏面的代碼向下執行

// 比如 1 + 2 是一個表達式，那麼 這個表達式的結果就是 3 
console.log(1 + 2) // 3
 
function fn() {  // 執行代碼 }
 
// fn() 也是一個表達式，這個表達式就沒有結果出現 
console.log(fn()) // undefined

• return 關鍵字就是可以給函數執行完畢一個結果

function fn() {  
// 執行代碼  
return 100 
}
 
// 此時，fn() 這個表達式執行完畢之後就有結果出現了 
console.log(fn()) // 100

• 終止代碼向下執行

function fn() {  
// 執行代碼  
return 300;
condole.log("hello");//這行代碼在控制檯裏面沒有輸出 
}
console.log(fn())

練習

<script>
// 1、編寫一個函數，根據輸入的兩個參數，求該範圍階乘之和。例如：1-10，5-11...等
    // 兩個數字之間的階乘求和
    function getSum(start, end) {
        var sum = 0;
        for (var i = start; i <= end; i++) {
            var num = 1;
            for (var j = 1; j <= i; j++) {
                num *= j;
            }
            sum += num;
        }
        return sum;
    }
    var start = parseInt(prompt("根據輸入的兩個參數，求該範圍階乘之和\n請輸入第一個值："))
    var end = parseInt(prompt("請輸入第二個值："));
    var str = start + "到" + end + "之間的階乘之和:" + getSum(start, end);
    alert(str)


// 編寫一個函數,根據傳入的參數，輸出該位置上斐波那契數是多少。例如：1 1 2 3 5 8 13 21
    function getFactorial(num) {
        var a = 1; //第一個值
        var b = 1; //第二個值
        var n = 0;
        for (var i = 1; i < num; i++) {
            n = a;
            var temp = b; //臨時變量
            b = a + b;
            a = temp;
        }
        return n;
        // console.log(a);
    }
    var num3 = parseInt(prompt("輸出某個位置上的斐波那契數\n 1 1 2 3 5 8 13 21 ..."))
    var str2 = "第" + num3 + "位的斐波那契數是" + getFactorial(num3);
    alert(str2);
</script>