ECMAScript 2020：使用可选参数优化函数参数-JavaScript中文网-JavaScript教程资源分享门户

随着JavaScript的深入发展，越来越多的开发者仍然在参数列表中堆积大量的参数，这使得代码难以阅读和维护。在 ECMAScript 2020 中，引入了可选参数的概念，允许开发者在声明函数时指定可能省略的参数，从而简化代码、提高可读性。

使用可选参数

在传统的JavaScript中，函数参数传递是通过位置确定的，而不是通过名称或关键字。为了提高代码可读性，通常使用对象来传递参数。然而，即使使用对象，还是需要在函数调用时指定对象中的每个参数。

function createUser(name, age, gender, address, email) {
  // create user
}

createUser('Alice', 25, 'female', '123 Main St', 'alice@example.com');

这段代码包含了5个参数，当你在使用这段代码时，如果你不能记住它们的顺序，代码将变得难以理解。

相反，使用可选参数可以使代码更易于理解，如下所示：

function createUser(name, { age, gender, address, email }) {
  // create user
}

createUser('Alice', { age: 25, gender: 'female', address: '123 Main St', email: 'alice@example.com'});

在这种情况下，使用对象传递参数，使函数调用更加可读。这些参数可选，可以省略掉任何你不需要的参数。

使用默认值

在传统的JavaScript中，可以使用 || 运算符来设置给予某个值的参数的默认值，但是这种方法有一个缺点，即无法向参数传递 falsy 值。

使用可选参数时，您可以为所有参数设置默认值：

function createUser(name, { age = null, gender = null, address = null, email = null } = {}) {
  // create user
}

createUser('Alice');

可以注意到，我们此时为整个参数列表声明了默认对象值。如果第二个参数未被传递，则默认为空对象，我们在函数定义中设置的默认值将被使用。

总结

可选参数是 ECMAScript 2020 中的一个重要特性，它可以使函数声明更具可读性、简洁性和清晰性。通过对象传递参数并使用默认值可以更好地组织代码，并使其更易于理解和维护。

示例代码

以下是示例代码：

function createUser(name, { age = null, gender = null, address = null, email = null } = {}) {
  // create user
}

createUser('Alice');
createUser('Bob', { age: 30 });
createUser('Carol', { age: 28, gender: 'female' });

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65b4ce13add4f0e0ffda96ab