在 ECMAScript 2020 (ES11) 中如何实现可选函数参数

在 ECMAScript 2020 (ES11) 中如何实现可选函数参数

在编写 JavaScript 代码时，我们经常需要使用函数来封装一些操作。有时候，我们会遇到需要传入可选参数的情况。在 ECMAScript 2020 (ES11) 中，我们可以使用一些新的语法来实现可选函数参数。

ES11 中的可选函数参数

在 ES11 中，我们可以使用 ? 来表示可选参数。例如，下面的代码定义了一个带有两个可选参数的函数：

function greet(name, message, options?) {
  console.log(`Hello, ${name}! ${message}`);
  if (options) {
    console.log(`Options: ${JSON.stringify(options)}`);
  }
}

在这个函数中，我们使用了 ? 来表示 options 是可选的参数。这意味着我们可以调用这个函数，只传入两个参数，例如：

greet('Alice', 'How are you?');

我们也可以传入第三个参数 options，例如：

greet('Bob', 'Nice to meet you!', { showDetails: true });

在这个例子中，我们传入了一个包含 showDetails 属性的对象作为 options 参数。

使用默认参数值

除了使用可选参数，我们还可以使用默认参数值来简化函数的调用。在 ES11 中，我们可以使用 = 来设置默认参数值。例如，下面的代码定义了一个带有一个可选参数和一个默认参数值的函数：

function greet(name, message = 'How are you?', options?) {
  console.log(`Hello, ${name}! ${message}`);
  if (options) {
    console.log(`Options: ${JSON.stringify(options)}`);
  }
}

在这个函数中，我们使用 = 来设置 message 参数的默认值为 'How are you?'。这意味着我们可以调用这个函数，只传入一个参数，例如：

greet('Alice');

在这个例子中，我们只传入了一个参数 name，但是因为 message 参数有默认值，所以这个函数仍然可以正常工作。

结论

在 ECMAScript 2020 (ES11) 中，我们可以使用 ? 和 = 来实现可选函数参数和默认参数值。这些新的语法可以使我们编写更加简洁和可读的代码。在编写函数时，我们应该根据实际需求来选择使用哪种语法，以便使代码更加清晰易懂。

示例代码

下面是一个完整的示例代码，演示了如何使用可选参数和默认参数值：

-- -------------------- ---- -------
-------- ----------- ------- - ---- --- ------ --------- -
  ------------------- -------- -------------
  -- --------- -
    --------------------- -----------------------------
  -
-

-------------- ---- --- -------
------------ ----- -- ---- ------ - ------------ ---- ---
-----------------

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6764de06856ee0c1d42f263a