JavaScript 之 函式

學習目標：

為什么需要函式

根據語法書寫函式

根據需求封裝函式

形參和實參的傳遞程序

使用函式的回傳值

使用arguments獲取函式的引數

1.函式的實參和形參

   <script>
        //函式形參實參個數匹配
        function getSum(num1, num2){    //num1 num2 為形參
            console.log(num1+num2);
            
        }
        // 1.如果實參個數和形參個數一致則正常輸出結果
        // 2.如果實參個數多于形參個數 會取到形參個數
        getSum(1,2,3);   //123 為實參
        // 3.如果實參個數小于形參的個數  多余的形參定義為undefined 最終結果就是NaN
        //形參可以看作不用宣告的變數 num2是一個變數但是沒有接收值 結果就是undefined
        getSum(1);//NaN
        //建議 我們盡量讓實參個數和形參個數相匹配

2.函式的回傳值

2.1 return  陳述句

    <script>
        //函式是做某件事或者實作某種功能
        function cook(aru){
            console.log(aru);       
        }
        cook('大肘子');
        //函式的回傳值格式

      /*   function 函式名(){
            return 需要回傳的結果;
        }
        函式名(); */

        //(1)我們函式只是實作某種功能，最終的結果需要回傳函式的呼叫者 函式名（）  通過return()來實作
        //(2)只要函式遇到return就把后面的結果 回傳給函式的呼叫者    函式名（） = return后面的結果
        //3.代碼驗證
        function getResult(){
            return 666;
        }
        getResult(); //getResult = 666;
        console.log(getResult());
        // 4.求任意兩個數的和
        function getSum(sum1,sum2){
            return sum1+sum2;
        }
        console.log(getSum(1,2));
    </script>

2.2函式回傳值實體

任意兩個數的最大值

        function getMax(sum1,sum2){
           /*  if (sum1 > sum2)
            {
                return sum1 ;
            }else{
                return sum2 ;
            }    */
            return sum1 > sum2 ? sum1 : sum2;
        }
        console.log(getMax(2,3));

任意一個陣列中的最大值

   </script>
function getarrMax(arr){ //arr接受一個陣列
        var  max = arr[0];
        for(var i = 0 ;i<arr.length ; i++)
        {
            if(arr[i] > max)
            {
                max = arr[i];
            }
        }
        return max;
    }
    var re = getarrMax([5,2,99,101,67,77]);//實參是一個陣列
    console.log(re);
    
    </script>

2.3 return終止函式

return之后的代碼就不再執行了

  <script>
        //函式回傳值注意事項
        //1.return終止函式
        function getSum(num1,num2){
            return num1+num2;//return 后面的代碼不會被執行
            alert('我是不會被執行的偶')
        }
        console.log(getSum(1,2));
    </script>

2.4 return 只能回傳一個值，如果逗號隔開多個值，以最后一個為準

    <script>
        //
        function getSum1(num1,num2){
            return num1,num2;//return 回傳的接軌是最后一個值
        }
        console.log(getSum1(1,2));
    </script>

        //3.非要回傳多個值，用陣列
        function getResult(num1,num2){
            return [num1+num2 , num1 - num2 , num1 * num2 , num1 / num2];
        }
        console.log(getResult(1,2));

2.6 函式沒有return回傳undefined

        function getResult(num1,num2){
           
        }
        console.log(getResult(1,2));//沒有return回傳undefined;

3.break,continue，return的區別

break 結束當前回圈體（for while）

continue 跳出本次回圈，繼續執行下次回圈（for while ）

return 不僅可以退出回圈 還能回傳return陳述句中的值 同時還可以結束當前函式體內的代碼

4.arguments的使用

   當我們不確定有多少個引數傳遞的時候，可以用arguments來獲取，在JavaScript中，arguments實際上他是當前函式的一個內置物件，所有函式都內置了一個aguments物件，arguments物件存盤了了傳遞函式的所有實參，

    <script>
        // arguments的使用 只有函式才有，arguments物件 而且是每個函式都內置好了這個arguments
        function fn(){
            console.log(arguments);//里面存盤了所有傳遞過來的實參 arguments = [1,2,3]
            console.log(arguments.length);
            console.log(arguments[2]);
            // 我們可以按照陣列的方式遍歷arguments
            for (var i=0 ; i < arguments.length ; i++){
                console.log(arguments[i]);
            }           
        }
        fn(1,2,3);
    </script>

arguments實體

        //利用arguments求陣列中的最大值
        function getMax(){
            var max = arguments[0]
            for(var i = 0 ; i <= arguments.length ; i++)
            {
                if(arguments[i] > max)
                {
                    max = arguments[i]
                }
            }
            return max;

        }
        console.log(getMax(133,244,3));
    </script>

 5.函式的兩種宣告方式

  （1）利用函式關鍵字自定義函式（命名函式）

    function fn (){}；

    fn;

   (2) 函式運算式(匿名函式)

   var 變數名 = function() {};

   和變數命名很相似   

標籤：JavaScript

上一篇：vscode分享代碼插件Polacode

下一篇：Vue專案重繪頁面的幾種方法總結