在 ES6 中，箭头函数被引入了。箭头函数通常被认为是更加干净和简洁的函数形式，特别是对于简单的回调函数。
在 ES2020 中，我们得到了一个新特性 - 可选括号的箭头函数。
在本文中，我们将探讨可选括号的箭头函数的语法、用途以及如何使用它们。
什么是可选括号的箭头函数？
可选括号的箭头函数与普通的箭头函数类似，但是在某些情况下，您可以省略花括号。
让我们看看一个基本的可选括号的箭头函数，它返回传递给它的数字参数的平方：
const square = num => num * num;
可以看到，这个函数省略了花括号，因为只有一行代码。
在这样的情况下，可以通过根据语法自动推断来省略花括号。当然，您可以继续使用花括号。
让我们看看另一个例子：
const names = ['Alice', 'Bob', 'Eva']; const lengths = names.map(name => name.length); console.log(lengths); // [5, 3, 3]
在这个例子中，我们使用箭头函数去遍历一个字符串数组，并返回每个字符串的长度。由于我们只有一行代码，我们可以省略花括号。
可选括号的箭头函数的用途
可选括号的箭头函数的主要用途是使代码更加简洁和易读。在某些情况下，它们可以消除单行代码的冗长，使得代码更清晰和简单。
让我们看看另一个例子，这次是一个更复杂的函数：
const getFullName = (firstName, lastName) => {
const fullName = `${firstName} ${lastName}`;
return fullName;
};这个函数以首尾名为参数，并将它们拼接成一个完整的全名。现在，假设我们只有一行代码：
const getFullName = (firstName, lastName) => `${firstName} ${lastName}`;这行代码使用了可选的花括号，使我们能够将函数代码压缩到一行。
如何使用可选括号的箭头函数
可选括号的箭头函数是强大的语法，可以将许多简单和复杂的函数简化到少数行代码中。
但是我们应注意，简单性和可读性往往比代码长度更为重要。
在编写可选括号的箭头函数时，请确保代码仍然保持易于理解和维护。如果您的代码变得难以理解，请考虑使用花括号。
结论
可选括号的箭头函数是 ES2020 提供的强大的语法。它使得编写简洁和简单的函数变得更加容易。
在使用它们时，请注意使代码易于理解和易于维护。
示例代码：
const square = num => num * num;
const names = ['Alice', 'Bob', 'Eva'];
const lengths = names.map(name => name.length);
const getFullName = (firstName, lastName) => `${firstName} ${lastName}`;来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/671df1ed2e7021665ef48eb9