二十九、函数的重载及arguments介绍

29.1 函数的重载

重载的概念：

在一个程序中，声明多个函数名相同，参数类型及参数的个数不同的函数，叫函数的重载。表示不同函数

但是，在JS中，没有重载的概念，因为声明多个相同的函数名时，后面的会覆盖前面的相同函数名。

<script>
    // 求不同数量的数值的和
    function sum1(num1, num2){
        var result = num1 + num2;
        console.log(result);
    }
    sum1(10, 20);        // NaN  undefined

    function sum1(num1, num2, num3){
        var result = num1 + num2 + num3;
        console.log(result);
        console.log(num3);  // 当实参的数量，小于形参的数量，前面的会依次匹配，后面不够的会认为是undefined
    }

    sum1(10, 20);   // NaN  undefined
    sum1(20, 30, 40);   // 90  40
    sum1(10, 20, 30, 40); // 60  30
    // 在JS中，没有重载的概念，因为声明多个相同的函数名时，后面的会覆盖前面的相同函数名。不会出现重载的问题
    // 当实参的数量，小于形参的数量，前面的会依次匹配，后面不够的会认为是undefined
    // 当实参的数量，多余形参的数量，前面的会依次匹配，多余的实参不要了
</script>

• 在JS中，没有重载的概念，因为声明多个相同的函数名时，后面的会覆盖前面的相同函数名。不会出现重载的问题

• 当实参的数量，小于形参的数量，前面的会依次匹配，后面不够的会认为是undefined

• 当实参的数量，多余形参的数量，前面的会依次匹配，多余的实参不要了

29.2 arguments模拟函数的重载

我们可以通过arguments来模拟函数的重载。

29.2.1 arguments对象

arguments对象是我们JS中一个特殊的对象，它是一个类数组，具有索引值，索引从0开始依次递增。通过索引可以获取到对应的值。

具有属性length，获取参数的数量。

<script>
    /* arguments对象是我们JS中一个特殊的对象，它是一个类数组，具有索引值，索引从0开始依次递增。通过索引可以获取到对*应的值。
    *具有属性length，获取参数的数量。 
    */

    function fn(){
      console.log("arguments.length", arguments.length);
      for(var i = 0 ; i < arguments.length ; i++){
        console.log("对应的索引", i, "的参数为：", arguments[i]);  // [i]表示类数组
      }
    }

    // 调用fn()
    fn();   // arguments.length 0      长度为 0，代表没有参数
    fn(1);  // arguments.length 1      长度为 1，代表有 1 个参数
    fn(1, "Hello");  // arguments.length 2      长度为 2，代表有 2 个参数
    fn(1, "Hello", 10, 30);  // arguments.length 4      长度为 4，代表有 4 个参数 
</script>

arguments是函数内部自带的类数组对象。保存的是函数执行时的实际参数。

// 声明函数
// 声明语句中书写的参数是形参
function fun(a,b,c){
    // 函数内部自带的对象
    console.log(arguments);
}
// 函数执行，书写的是实参
fun(1,2,3,4,45,5,6);

• 数据类型是对象

• 在读取数据时和数组方式相同

• 保存的是函数执行时的实际参数。

数据类型

console.log(typeof arguments);

读取 索引值从0开始

console.log(arguments[0]);

赋值

arguments[0] = 100;
console.log(arguments);

length也可以使用

console.log(arguments.length);

不能通过索引值将arguments拉长

arguments[10] = 10;
console.log(arguments.length);

arguments只能通过length将arguments拉长

arguments.length = 10;
console.log(arguments.length);
console.log(arguments);

可以通过length进行遍历

for(var i = 0 ; i <=arguments.length - 1 ; i++){
    console.log(arguments[i]);
}

不是所有数组的方法arguments都可以使用

arguments.slice(1,5);

29.2.2 使用arguments对象模拟函数的重载

通过arguments对象可以遍历到每一个参数。那么此时思考通过这个特殊的参数，来进行不同数量的数值的求和。

<script>
    // 通过arguments对象可以遍历到每一个参数。那么此时思考通过这个特殊的参数，来进行不同数量的数值的求和。
    var count = 0;
    function sum(){
      console.group("开始" + count++);
      for(var i = 0 ; i < arguments.length ; i++){
        console.log(arguments[i]);
      }
      console.groupEnd();
    }

    sum(10);
    sum(10, 20);
    sum(10, 20, 30, 40);
    sum(10, 20, 30);
</script>

<script>
    // 通过arguments对象可以遍历到每一个参数。那么此时思考通过这个特殊的参数，来进行不同数量的数值的求和。
    var count = 0;
    function sum(){
      var result = 0 ;
      console.group("开始" + count++);
      for(var i = 0 ; i < arguments.length ; i++){
        // 将遍历到的每个参数数值累加到result里
        result += arguments[i];  // result = result + arguments[i]
      }
      console.log(result);
      console.groupEnd();
    }

    sum(10);
    sum(10, 20);
    sum(10, 20, 30, 40);
    sum(10, 20, 30);
</script>

// 声明函数
// 参数：3个，数字
// 返回值：加和
function sum(a,b,c){
    // 分情况 
    if(arguments.length === 2){
        return a + b;
    }else if (arguments.length === 3){
        // a,b较大值和c相加
        return (a > b ? a : b) + c;  // 三元表达式 a>b 为真取a,为假取b
    }else{
        return "输入有误";
    }
}
// 调用
console.log(sum(2,3));  // 5    2+3
console.log(sum(2,3,4));  // 7    3+4
console.log(sum(2,3,4,5));  // 输入有误
console.log(sum());  // 输入有误

// 声明函数
// 参数：3个，数字
// 返回值：加和
function sum(a,b,c){
    // 使用switch语句
    switch(arguments.length){
    // 如果是2个实参
    case 2:
        return a + b;
        break;
    case 3:
        return (a < b ? b : a) + c;
        break;
    // 以上情况都不是
    default:
        throw new Error("输入有误");    // 手动模拟报错
    }
}
// 调用
console.log(sum(2,3));  // 5    2+3
console.log(sum(2,3,4));  // 7    3+4
console.log(sum(2,3,4,5));  
console.log(sum());