详解 ECMAScript 2020 中的可选参数和默认参数
在 ECMAScript 2020 中，函数的参数有了新的特性：可选参数和默认参数。这两个特性可以让我们写出更加简洁、易于维护的代码。本文将详细介绍这两个特性的用法和注意事项，并提供示例代码供读者参考。
可选参数
可选参数是指在调用函数时，可以传入也可以不传入的参数。在以往的 JavaScript 中，如果我们需要实现可选参数的功能，通常需要手动判断参数是否传入并作出相应的处理。而在 ECMAScript 2020 中，我们可以使用问号 ? 来定义可选参数。
-- -------------------- ---- ------- -------- ------------ ------- - -- ------ - ------------------- ----------- - ---- - ------------------- ------------ - - -------- -- --------- --------- ------------- -- --------- ----展开代码
在上面的示例中，我们定义了一个名为 greet 的函数，并在参数 name 后加上了问号，表示这是一个可选参数。在函数体内，我们通过判断参数 name 是否存在来输出不同的问候语。
需要注意的是，可选参数必须放在参数列表的末尾。例如下面的代码是无效的：
function greet(name?: string, age: number) { // ... }
默认参数
默认参数是指在调用函数时，如果没有传入某个参数，则使用预设的默认值。在 ECMAScript 2020 中，我们可以使用等号 = 来定义默认参数。
function greet(name = 'stranger') { console.log(`Hello, ${name}!`); } greet(); // 输出：Hello, stranger! greet('Tom'); // 输出：Hello, Tom!
在上面的示例中，我们定义了一个名为 greet 的函数，并在参数 name 后加上了等号和默认值 'stranger'。在函数体内，我们直接使用了参数 name，无需再进行判断。
需要注意的是，和可选参数一样，默认参数也必须放在参数列表的末尾。例如下面的代码是无效的：
function greet(name = 'stranger', age: number) { // ... }
深度和学习以及指导意义
可选参数和默认参数的出现，可以让我们写出更加简洁、易于维护的代码。在开发大型项目时，函数的参数往往非常复杂，使用可选参数和默认参数可以减少代码量，提高开发效率。
同时，使用可选参数和默认参数还可以增强代码的可读性。在函数调用时，我们可以根据函数定义中的默认参数和可选参数，快速判断出需要传入哪些参数，哪些参数是可选的，哪些参数有默认值，从而更加清晰地理解代码的含义。
值得一提的是，在 TypeScript 中，可选参数和默认参数的支持更加完善。通过使用 TypeScript，我们可以在编写代码时就对参数进行类型检查和提示，避免出现一些常见的错误。
示例代码
下面是一个使用可选参数和默认参数的示例代码：
-- -------------------- ---- ------- --------- ---- - ----- ------- ----- ------- - -------- ----------- ----- ------- - -------- - ----- - ----- --- - - ----- -- ----- - ------------------------ ------- ------------ - ---- - ------------------------ ----------- - - ------- ----- ----- --- -- --------- ---- ------- ----- -------- ---- -- -- ------ -- ------ ----- -----展开代码
在上面的示例中，我们定义了一个名为 greet 的函数，接受一个对象类型的参数 user 和一个字符串类型的参数 message，并在参数 message 后加上了等号和默认值 'Hello'。在函数体内，我们通过解构赋值获取参数 user 中的属性，并根据属性 age 的存在与否输出不同的问候语。在函数调用时，我们可以只传入必要的参数，而可选参数和默认参数会自动使用预设的值。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67cbf702e46428fe9e51fcd9
