ECMAScript 2017 中函数的参数默认值与剩余参数的使用
在 ECMAScript 2015 （ES6）中，JavaScript 引入了默认参数和剩余参数的概念，它们都是为了方便函数的使用和提高代码的可读性。在 ECMAScript 2017 （ES8）中，这些概念得到了进一步的扩展和增强。本文将介绍 ECMAScript 2017 中函数的参数默认值与剩余参数的使用方法以及常见的应用场景。
一、函数的默认参数值
在 ECMAScript 2015 中，我们可以通过给函数参数设置默认值来避免传递 undefined 或 null 的问题。以此为例:
function foo(a=1) { console.log(a); }
foo(); // 输出 1 foo(2); // 输出 2 foo(undefined); // 输出 1
在 ECMAScript 2017 中，默认参数值的使用方式有两个新增的特性。首先，现在可以使用函数作为默认参数的值。比如：
function bar(a, b=()=>a) { console.log(b()); }
bar(1); // 输出 1 bar(1, () => 2); // 输出 2
在这个示例中，参数 b 可以接收一个函数作为默认值。当没有给 b 传递实际的值时，就会使用默认值。注意，由于 JavaScript 中的函数运作方式，箭头函数中的 this 始终指向其外层函数的 this，因此在箭头函数中可以访问函数 bar 参数 a 的值。
其次，我们也可以使用其他参数作为默认值。比如：
function baz(a, b=a) { console.log(b); }
baz(1); // 输出 1 baz(1, 2);// 输出 2
在这个示例中，参数 b 的默认值为参数 a 的值。这就使得在 b = a 的情况下，调用 baz 函数相当于只传递了一个参数。
二、函数的剩余参数
在 ECMAScript 2015 中，我们可以使用剩余参数（也叫 rest 参数，以 ... 开头表示）来指定一个函数中接受任意数目参数的方式。这些参数会被封装为一个数组，可以通过数组方法来访问它们。比如：
function qux(...args) { console.log(args); }
qux(); // 输出 [] qux(1, 2, 3); // 输出 [1, 2, 3]
在 ECMAScript 2017 中，剩余参数也得到了更新。新的剩余参数语法允许我们使用解构语法来对数组进行解构操作。比如：
function quux(a, b, ...[c, d]) { console.log(a, b, c, d); }
quux(1, 2, 3, 4); // 输出 1 2 3 4
在这个示例中，我们使用了解构语法来解构剩余参数中的前两个元素为 a 和 b。其中，剩余参数被解构为数组 [c, d]，可以直接访问其中的元素。
三、应用场景
在实际的开发中，参数默认值和剩余参数可以帮助我们处理各种场景。下面介绍一些常见的应用。
- 合并对象
我们可以使用剩余参数来实现合并对象的功能。比如：
function merge(...objects) { return Object.assign({}, ...objects); }
console.log(merge({a: 1}, {b: 2}, {c: 3})); // 输出 {a: 1, b: 2, c: 3}
在这个示例中，我们使用了剩余参数将所有的输入对象合并成了一个新的对象。每个对象都被展开为属性和值，然后传递到 Object.assign() 函数中。
- 模板字符串
我们可以使用默认参数来生成模板字符串。比如：
function templateString(name = 'Alice') {
return Hello, ${name}!;
}
console.log(templateString()); // 输出 "Hello, Alice!" console.log(templateString('Bob')); // 输出 "Hello, Bob!"
在这个示例中，函数 templateString 的参数 name 接收了一个默认值，这样我们就可以在调用函数时不传入参数。这个函数生成了一个简单的模板字符串，但是很容易扩展成任意数量的参数。
- 类型判断
我们可以使用默认参数来进行类型判断。比如：
function isNumber(a = throwIfMissing()) { return typeof a === 'number'; }
function throwIfMissing() { throw new Error('Missing parameter'); }
console.log(isNumber(1)); // 输出 true console.log(isNumber()); // 抛出错误 "Missing parameter"
在这个示例中，函数 isNumber 中的参数 a 用来进行类型判断，如果未传入参数，将会抛出一个错误。
总结
在 ECMAScript 2017 中，函数参数默认值和剩余参数得到了进一步的扩展和增强。这些特性可以帮助我们编写更加简洁和直观的代码，并且可以处理更加复杂的场景。以上是一些常见的应用场景，但实际用法还可以更多，需要根据实际情况来选择合适的方式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/650013be95b1f8cacde48172