ES11 是 JavaScript 的最新版本，在这个版本中引入了一些非常酷的新特性。其中一个值得关注的特性是将可选参数移动到函数的最后，这个特性可以提高代码的可读性和灵活性。在这篇文章中，我们将深入探讨这个新特性，并提供一些有用的示例代码和使用指南。
面对传统参数问题
在过去的 JavaScript 中，参数的顺序通常非常重要。如果你想要传递一个可选参数，你必须在参数列表中指定它的位置，并在传递参数的时候指定下标。这种方法有时候很麻烦，因为当你使用函数时，可能会忘记可选参数的下标，或者区分哪些是必选的和哪些是可选的，因此需要写更多的代码来检查。
例如，假设你有这样一个函数：
function greet(name, message, punctuation) {
punctuation = punctuation || '!'; // 如果没传入标点符号，则默认为感叹号。
message = message || 'Hello';
console.log(`${message} ${name}${punctuation}`);
}我们在调用这个函数时需要确保参数列表的正确顺序和下标，否则就会出现问题：
greet('John'); // Hello John!
greet('John', 'Hi'); // Hi John!
greet('John', 'Hi', '.'); // Hi John.
greet('.', 'John', 'Hi'); // . JohnHi!现在，在 ES11 中，我们可以将可选参数移动到末尾，这样我们可以更好地组织函数参数列表，并且代码的可读性也得到了提高。
移动可选参数
让我们来看一下如何将可选参数移动到 ES11 中：
function greet(name, { message = 'Hello', punctuation = '!' } = {}) {
console.log(`${message} ${name}${punctuation}`);
}在这个函数中，我们使用了一个对象来封装可选参数 { message, punctuation }，并且使用了 ES6 中的解构赋值方式来处理它们。然后，我们将这个对象完全置于参数列表末尾，以使函数调用更容易。
让我们看一下这个函数是如何运行的：
greet('John'); // Hello John!
greet('John', { message: 'Hi' }); // Hi John!
greet('John', { punctuation: '.' }); // Hello John.很明显，我们可以更清楚地看到可选参数是如何使用的。此外，可选参数的默认值已经在函数定义中定义，而不需要在函数中进行额外的逻辑检查。
适用性分析
当我们考虑将可选参数移动到函数末尾时，有一些关键因素需要考虑。首先，有些函数将无法从这个特性中获益。例如，如果函数中有多个参数集，或者需要为多个参数集传递不同的默认值，则这个特性可能不适用。
是的，这个新特性不是万能的，但它确实可以在某些情况下带来明显的好处。尤其是在你需要组织大量可选参数的情况下，将可选参数列表全部放到参数列表末尾会使代码更加整洁。
结论
在 ES11 中，将可选参数移动到函数末尾，这是一项实用的语言特性，可以提高代码的可读性和灵活性。我们可以使用一个对象来封装所有的可选参数，并在函数中使用解构赋值方式来处理它们。本文提供了一些示例代码和指导意义，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672dd140eedcc8a97c860962