随着前端技术的不断发展，ECMAScript 也在不断地更新。最新的 ECMAScript 2020 (ES11) 引入了一些新的特性，其中包括函数参数属性。本文将详细介绍函数参数属性的概念、用法以及其在实际开发中的指导意义。
什么是函数参数属性
函数参数属性是指在函数中声明的参数可以拥有一些额外的属性，这些属性可以用来控制函数的行为。在 ES11 中，函数参数属性主要包括以下两种：
default：用于设置参数的默认值。rest：用于将多余的参数打包成一个数组。
函数参数属性的用法
default 属性
在之前的 ECMAScript 版本中，我们可以通过以下方式为函数参数设置默认值：
function foo(x, y) {
x = x || 0;
y = y || 0;
// ...
}在上面的例子中，如果函数调用时没有传入参数，那么 x 和 y 的值将会被设置为 0。但是这种方式存在一些问题：
- 当传入的参数为 0 或者空字符串时，这种方式会将其视为 false 而设置默认值。
- 当传入的参数为 undefined 时，这种方式才会起作用，但是这种方式并不直观。
在 ES11 中，我们可以使用 default 属性来设置参数的默认值，如下所示：
function foo(x = 0, y = 0) {
// ...
}上面的例子中，如果函数调用时没有传入参数，那么 x 和 y 的值将会被设置为 0。这种方式更加直观且不会出现上述问题。
rest 属性
在之前的 ECMAScript 版本中，如果我们需要处理多个参数，那么通常采用以下方式：
function sum() {
let result = 0;
for (let i = 0; i < arguments.length; i++) {
result += arguments[i];
}
return result;
}在上面的例子中，我们使用了 arguments 对象来获取传入的所有参数，并通过循环将它们相加。但是这种方式存在以下问题：
- arguments 对象不是一个真正的数组，无法使用数组的方法。
- arguments 对象没有明确的长度，需要通过 arguments.length 来获取。
在 ES11 中，我们可以使用 rest 属性来将多余的参数打包成一个数组，如下所示：
function sum(...args) {
let result = 0;
for (let i = 0; i < args.length; i++) {
result += args[i];
}
return result;
}上面的例子中，我们使用了 rest 属性将所有的参数打包成一个数组 args，并通过循环将它们相加。这种方式更加直观且具有数组的特性。
函数参数属性的指导意义
函数参数属性的引入，使得我们在编写函数时能够更加方便地处理参数。通过使用 default 属性，我们可以直接为参数设置默认值，而不需要手动处理 undefined、0、空字符串等情况。通过使用 rest 属性，我们可以直接将多余的参数打包成一个数组，而不需要使用 arguments 对象。
这种方式的引入，不仅可以提高代码的可读性和可维护性，还可以减少代码的冗余和错误。因此，在实际开发中，我们应该积极地使用函数参数属性来改善我们的代码。
示例代码
下面是使用函数参数属性的示例代码：
// www.javascriptcn.com code example
function foo(x = 0, y = 0, ...args) {
let result = x + y;
for (let i = 0; i < args.length; i++) {
result += args[i];
}
return result;
}
console.log(foo()); // 输出 0
console.log(foo(1)); // 输出 1
console.log(foo(1, 2)); // 输出 3
console.log(foo(1, 2, 3)); // 输出 6
console.log(foo(1, 2, 3, 4)); // 输出 10在上面的代码中，我们定义了一个名为 foo 的函数，该函数包含三个参数：x、y 和 args。其中 x 和 y 通过 default 属性设置了默认值为 0，args 通过 rest 属性将多余的参数打包成一个数组。在函数中，我们首先将 x 和 y 相加，然后使用循环将 args 数组中的所有元素相加，并返回结果。最后，我们分别调用了 foo 函数，并输出了其返回值。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d162e5a941bf71342f42e1