一、剩余参数
剩余参数语法允许我们将一个不定数量的参数表示为一个数组。
a、语法
function(a, b, ...theArgs) {
// ...
}
b、剩余参数和 arguments对象的区别
1、剩余参数只包含那些没有对应形参的实参,而 arguments 对象包含了传给函数的所有实参。
2、arguments对象不是一个真正的数组,而剩余参数是真正的 Array实例,也就是说你能够在它上面直接使用所有的数组方法,比如 sort,map,forEach或pop。
3、arguments对象还有一些附加的属性 (如callee属性)。
c、从 arguments 到数组
1、没有引入剩余参数时
function f(a, b) {
var normalArray = Array.prototype.slice.call(arguments);
// -- or --
var normalArray = [].slice.call(arguments);
// -- or --
var normalArray = Array.from(arguments);
}
2、引入剩余参数后
function f(...args) {
var normalArray = args;
}
d、解构剩余参数
function f(...[a, b, c]) {
return a + b + c;
}
f(1) // NaN (b and c are undefined)
f(1, 2, 3) // 6
f(1, 2, 3, 4) // 6 (the fourth parameter is not destructured)
e、剩余参数本质就是一个数组,所以可以使用所有数组的方法,而arguments如果要使用数组的方法,需要先转换成数组
参考链接:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters
二、默认参数
函数默认参数允许在没有值或undefined
被传入时使用默认形参。
a、语法
function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
statements
}
JavaScript 中函数的参数默认是undefined。然而,在某些情况下可能需要设置一个不同的默认值。这是默认参数可以帮助的地方。
如:
果在调用multiply时,参数b的值没有提供,那么它的值就为undefined。如果直接执行a * b,函数会返回 NaN。
function multiply(a, b) {
return a * b;
}
multiply(5, 2); // 10
multiply(5); // NaN !
以前使用额外的代码去处理这种情况
function multiply(a, b) {
b = (typeof b !== 'undefined') ? b : 1;
return a * b;
}
multiply(5, 2); // 10
multiply(5); // 5
现在可以直接用默认参数去处理
function multiply(a, b = 1) {
return a * b;
}
multiply(5, 2); // 10
multiply(5); // 5
b、在函数被调用时,参数默认值会被解析
function append(value, array = []) {
array.push(value);
return array;
}
append(1); //[1]
append(2); //[2], not [1, 2]
这个规则对于函数和变量也是适用的。
function callSomething(thing = something()) {
return thing;
}
let numberOfTimesCalled = 0;
function something() {
numberOfTimesCalled += 1;
return numberOfTimesCalled;
}
callSomething(); // 1
callSomething(); // 2
c、解构
function f([x, y] = [1, 2], {z: z} = {z: 3}) {
return x + y + z;
}
f(); // 6
参考链接:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Default_parameters