JavaScript笔记5 函数

目录

1.函数的概念

2.函数的使用

2.1声明函数

2.2调用函数

 2.3函数的封装

3. 函数的参数

形参：函数定义时候，传递的参数(实参值传递给形参,不用声明的变量)

实参：函数调用时候，传递的参数

函数形参和实参数量不匹配时

4. 函数的返回值return 终止函数

注意事项：！！！

break,continue,return的区别

自调用函数 

5. arguments的使用

6.函数是可以相互调用的

7.案例：

---

1.函数的概念

函数封装了一段可被重复调用执行的代码块，通过函数可以实现大量代码的重复使用。函数是一种数据类型。

2.函数的使用

2.1声明函数

  1. 通过function关键字定义函数 -- 命名函数
  function 函数名() {
    //函数体代码
  }
  // 1） function 是声明函数的关键字，必须小写
  // 2） 函数名 命名为动词形式 例: getSum
  // 3)  函数不调用自己不执行
  
   2. 通过函数表达式定义函数 ---匿名函数
  var 变量名 = function() {};
   // 例
  var fn = function() {
      console.log(34);
  };
  fn();
  // 1） fn是变量名，不是函数名
  // 2） fn是变量，只不过变量存储的是函数
  // 3） 函数表达式创建的函数可以通过 变量名(); 来调用
  // 4) 函数表达式也可以定义形参和调用传入实参。

  匿名函数使用的第2种方式--匿名函数自调用
  (function(){
    alert(123);
  })();

2.2调用函数

函数不调用，自己不执行

  函数名();     // 函数声明后调用才会执行函数体代码

 2.3函数的封装

• 函数的封装是把一个或者多个功能通过函数的方式封装起来，对外只提供一个简单的函数接口。

    //例用封装函数计算1-100累加和
  
  function getSum() {
      var sumNum = 0; // 准备一个变量，保存累加和
      for (var i = 1; i <= 100; i++) {
        sumNum += i; // 把每个数值 都累加 到变量中
      }
      alert(sumNum);
  }
  getSum();     // 调用函数

       //法二：
        function getSum(num1,num2) {
            var sum = 0;
            for (var i = num1 ; i <= num2 ;i++) {
                sum += i;
            }
            console.log(sum);
        }
        getSum(1,100);
        getSum(10,50);

3. 函数的参数

• 形参：函数定义时候，传递的参数(实参值传递给形参,不用声明的变量)

• 实参：函数调用时候，传递的参数

  //带参数的函数声明
  function 函数名(形参1,形参2,形参3...) {   //多个参数之间用逗号隔开
    //函数体
  }
  
  // 带参数的函数调用
  函数名(实参1,实参2,实参3...);

• 函数形参和实参数量不匹配时

参数个数	说明
实参个数等于形参个数	输出正确结果
实参个数多于形参个数	只取到形参的个数
实参个数小于形参	多的形参定义为undefined,结果为NaN

在JS中，形参的默认值是underfined

      function getSum(a, b, c) {
        return a + b + c;
      }
      // js中形参的默认值是undefined。
      // 调用函数
      var n = getSum(1, 2);// n = NaN
      var n = getSum(1, 2, 3, 4); //1 + 2 +3 = 6

4. 函数的返回值return 终止函数

返回值：函数调用整体代表的数据；函数执行完成后可以通过return语句将指定数据返回 。

注意事项：！！！

 1）函数遇到return会停止执行，并返回指定的值  在 return语句后面的代码不会执行
 2）如果函数没有return 返回的值是undefined
 3）return 只能返回一个值（最后一个值）

  // 声明函数
  function 函数名() {
    ...
    return 需要返回的值;

  }
  // 调用函数
  函数名(); //此时调用函数就可以得到函数体内return的值

        function fn(num1,num2) {
            return num1,num2;   //注意此时return未将值用括号括起来
        }
        console.log(fn(4,2));    //2  return只返回一个值（最后一个值）
      
        // 3. 我们求任意两个数的加减乘除结果
        function getResult(num1,num2) {
            return [num1 + num2,num1 - num2,num1 * num2,num1 / num2];  
                //注意此时有括号阔起来，（表示返回一个数组）
        }
        console.log(getResult(3,4));   //Array(4) [ 7, -1, 12, 0.75 ]
       
        // 4. 函数如果有return则返回的是return后面的值，若没有则返回underfined
        function fun1() {
            return 666;
        }
        console.log(fun1());    //666
        function fun2() {

        }
        console.log(fun2());     //underfined
        

break,continue,return的区别

• break: 结束当前的循环体 (如for、while)

• continue: 跳出本次循环，继续执行下次循环

• return: 不仅可以退出(函数体内)循环，还能够返回return语句中的值，同时还可以结束当前的函数体内的代码

自调用函数 

(function () {
    var x = "Hello!!";      // 我将调用自己
    return x;
})(); 

//例：
        var re1 = (function () {
            var x = "Hello!!";      // 我将调用自己
            return x;
        })();
        console.log(re1);  //Hello!!

5. arguments的使用

    当不确定有多少个参数传递的时候，可以用 arguments 来获取。JS中，arguments实际上它是当前函数的一个内置对象。所有函数都内置了一个 arguments 对象，arguments 对象中存储了传递的所有实参。arguments展示形式是一个伪数组，因此可以进行遍历。

只有函数才有arguments对象 ，而且每个函数都内置好了这个arguments

• 伪数组（并不是真正意义上的数组）具有以下特点：

  • 具有数组的length属性

  • 按索引方式存储数据

  • 不具有数组的push，pop等方法

  function fn() {
    //arguments 里面存储了所有传递过来的实参
    console.log(arguments);         // [1,2,3]  以数组形式
    console.log(arguments[1]);      // 2
    console.log(arguments.length);  // 3
    
    //我们可以按照数组的方式 遍历argument  
    for (var i = 0;i < arguments.length;i++) {
        console.log(arguments[i]);
    }
  }
  fn(1, 2, 3);

        // 3.利用函数求任意个数的最大值 （arguments的使用）
        function getMax3() {     //arguments = [1,2,3...]
            var max = arguments[0]; 
            for (var i = 1;i < arguments.length ; i++) {
                if (arguments[i] > max) {
                    max = arguments[i];
                }
            } 
            return max;
        }
        console.log(getMax3(1,2,3));              //3
        console.log(getMax3(1,2,3,4,5));          //5
        console.log(getMax3(11,42,36,89,30,28));  //89

6.函数是可以相互调用的

        // 函数是可以相互调用的
        function fn1() {
            console.log(11);
            fn2();      //在fn1中调用了fn2函数
        }
        function fn2() {
            console.log(22);
        }
        fn1();

7.案例：

        // 4.利用函数封装方式，翻转任意一个数组
        function reverse(arr1) {
            var arr2 = [];
            for (var i = arr1.length - 1; i >= 0 ; i--) {
                arr2[arr2.length] = arr1[i];
            }
            return arr2;
        }
        console.log(reverse([5,2,99,101,67,77]));    //Array(6) [ 77, 67, 101, 99, 2, 5 ]

        //6.判断闰年 要求：输入一个年份，判断是否为闰年
        function runYear(year1) {

            var flag;
            if ((year1 % 4 == 0 && year1 % 100 != 0) || year1 % 400 == 0) {
                flag = true;
            } else {
                flag = false;
            }
            return flag;
        }
        console.log(runYear(2022));

        // 7. 用户输入年份，输出当前年份2月的天数（运用“函数是可以相互调用的”）
        // 如果是闰年，则2月份是29天；如果是平年，则2月份是28天
        function backDay() {
            var year = prompt('请输入年份：');
            if (runYear()) {    //调用了案例6的函数，函数调用需要加小括号
                alert('当前年份是闰年，2月份有29天');
            } else {
                alert('当前年份是平年，2月份有28天');
            }
        }
        backDay();