es6中函数的默认参数用法和解析

带默认值的参数

函数中的参数可以传入默认值,当有实参传入的时候就赋值实参,当没有传递实参的时候或者指定传递的参数为undefined时,形参就会使用默认值。如:

function getNum(num1, num2 = 5) {
    return num1 + num2;
}
console.log(getNum(1)); // 6
console.log(getNum(1, 1)); // 2
console.log(getNum(1, undefined)); // 6

参数默认值表达式

函数参数的默认值不光可以是一个普通类型的值。也可以是一个函数表达式来获取值如:

    let value = 1;
    function getValue() {
        return value++;
    }
    function add(sum1, sum2 = getValue()) {
        return sum1 + sum2;
    }
    console.log(add(1, 1)); // 2
    console.log(add(1)); // 2
    console.log(add(1)); // 3

上述代码中,当调用add()函数没有第二个值传入的时候就会调用getValue()方法获取默认值,并且因为getValue()获取的是动态的值,所以每调用一次sum2就会赋值不同的值来进行计算。

参数默认值的暂时性死区

函数的参数还可以将前面参数的值,作为后面参数的默认值。如:

    function add(sum1, sum2 = sum1){
        return sum1 + sum2;
    }
    console.log(add(1)); // 2

上面的代码将sum1传入的值当作了sum2参数的默认值,也就是调用add()方法只需要传递一个参数就可以了。但是反过来将后面的参数作为前面参数的默认值就不行。如:

    function add(sum1 = sum2, sum2){
        return sum1 + sum2;
    }
    console.log(add(undefined, 1)); // 报错

上面代码将sum2参数的值作为sum1的默认参数就会报错,是因为出发了暂时性死区,当sum2赋值给sum1的时候,sum2还没有进行定义,所以报错。

剩余参数

设计剩余参数是为了替代 ES 中的 arguments。它是由(…)name 三个点和参数名所组成的,会将函数传入的参数按照传入顺序收集成一个数组。如:

 	function add(sum1, ...sum){
        return sum;
    }
    console.log(add(...[1,2,4,5])); //  [2, 4, 5]

上面代码会将第一个参数赋值给sum1,其他剩余的参数全部赋值给sum收集起来组成一个数组。(注意:在调用函数时使用…是展开运算符,将数组中的参数展开后传入。)

剩余参数会有两个限制:

1、 函数只能有一个剩余参数,并且它必须被放在最后。
2、 不能在对象字面量的 setter 属性中使用(因为对象字面量的 setter 被限定只能使用单个参数)。
例:

    function add(...sum, sum1){
        return sum;
    }
    console.log(add(1,2,4,5)); //  语法错误

    let obj = {
        set name(...value) { // 语法错误
            console.log(value);
        }
    };
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值