ES6函数传参——默认参数和剩余参数

雨点打透心脏的1/2处 2023-02-17 02:28 21阅读 0赞

## **一、默认参数** ##

1、只有在未传递参数，或者参数为 undefined 时，才会使用默认参数，null 值被认为是有效的值传递。

即使显式的传入`undefined`（虽然不是`null`或其他[falsy][]值），但是形参的值还是默认值。

2、调用时解析

在函数被调用时，参数默认值会被解析，比如：

function append(value, array = []) {
      array.push(value);
      return array;
    }
    
    append(1); //[1]
    append(2); //[2], not [1, 2]

默认值也可以是已经被定义的函数或变量，需要注意，调用时才会解析默认值，所以要注意申明的函数和变量的位置。

function foo(funcResult = bar()) {
                console.log(funcResult)
            }
    
            let num = 0;
    
            function bar() {
                num += 1;
                return num;
            }
    
            foo(); // 1
            foo(); // 2

默认参数的默认值可以是变量，也可以是该函数前面的形参

function foo(a,b=a,c = a +b){
                console.log(a,b,c)
            }
            foo(1); // 1 1 2

通过解构赋值为默认参数赋值

function f([x, y] = [1, 2], {z: z} = {z: 3}) { 
      return x + y + z; 
    }
    
    f(); // 6

## 二、剩余参数 ##

**剩余参数**语法允许我们将一个不定数量的参数表示为一个数组。

剩余参数和 `arguments`对象之间的区别主要有三个：

*  剩余参数只包含那些没有对应形参的实参，而 `arguments` 对象包含了传给函数的所有实参。
 *  `arguments`对象不是一个真正的数组，而剩余参数是真正的 `Array`实例，也就是说你能够在它上面直接使用所有的数组方法，比如 `sort`，`map`，`forEach`或`pop`。
 *  `arguments`对象还有一些附加的属性 （如`callee`属性）。

function sum(a,b, ...c){
      console.log(c);
    }
    sum(1,2,3,4,5);

三、非严格模式、严格模式、ES6剩余参数下的arguments对比

[falsy]: https://developer.mozilla.org/zh-CN/docs/Glossary/Falsy