在 ECMAScript 2015（ES6）中引入了箭头函数（arrow functions），弥补了传统函数语法的不足，并且可以更加简洁地表达函数。随着 ECMAScript 的不断更新，箭头函数的功能也得到了进一步增强。在 ECMAScript 2021（ES12）中，新的 () => {} 形式的函数就摆在了我们的面前。
1. 什么是 () => {} 形式的函数
在介绍 () => {} 形式的函数之前，我们先来了解一下传统函数的定义形式：
function traditionalFunction(a, b) {
return a + b;
}这是一个传统的函数定义形式，包含了 function 关键词、函数名、参数和函数体。在 ES6 中，引入了箭头函数：
const arrowFunction = (a, b) => {
return a + b;
}箭头函数去掉了 function 关键词，使用 => 符号连接参数和函数体。() => {} 形式的函数则进一步简化了箭头函数的语法。我们可以使用 () 代替传统函数的参数部分，{} 代替箭头函数的函数体部分。
const minimalFunction = () => {};简化后的函数体不需要显示地 return 任何值，返回值是 undefined。
2. 特点和用法
() => {} 形式的函数与箭头函数相似，都是匿名函数，即没有名字标识符的函数。它们可以作为函数表达式或者函数参数使用。与箭头函数的差别在于，() => {} 形式的函数有一个更为简化的语法形式。
特点：
简洁：() => {} 形式的函数采用简洁的语法形式，可以更好地凸显 JavaScript 这门语言简单明了的特性。
可读性：函数的参数和函数体都采用了很短的语法结构，可以让代码更加易读。
易于理解：() => {} 形式的函数使用的是箭头符号，提升了代码的可视化水平，可以快速地让读者理解代码的功能。
适用范围：适用于身份验证、请求处理等简单任务。
用法：
- 声明：可以使用 const 或 let 关键词来声明函数。
const simpleFunction = () => {};
let simpleFunction2 = () => {};- 传递参数：可以使用 () 来定义函数的参数。如果只有一个参数，() 可以省略。如果没有参数，() 也可以省略。
// www.javascriptcn.com code example
const simpleFunction = (name) => {
console.log(name);
}
simpleFunction('Alice');
const simpleFunction2 = name => {
console.log(name);
}
simpleFunction2('Bob');
const simpleFunction3 = () => {
console.log('Hello world');
}
simpleFunction3();- 返回值：默认返回 undefined。可以使用 {} 来编写函数体，如果编写了函数体，可以使用 return 返回一个值。
// www.javascriptcn.com code example
const simpleFunction = () => {
return 'Hello world';
}
console.log(simpleFunction());
const simpleFunction2 = name => `Hello, ${name}!`;
console.log(simpleFunction2('Tom'));3. 示例代码
// www.javascriptcn.com code example
// 使用匿名函数作为回调函数
setTimeout(() => {
console.log('Hello world!');
}, 1000);
// 使用() => {} 形式的函数作为回调函数
setTimeout(() => console.log('Hello world!'), 1000);
// 如果没有参数，可以省略()
const secondsInHour = () => 60 * 60;
console.log(`There are ${secondsInHour()} seconds in an hour.`);
// 如果只有一个参数，() 也可以省略
const double = number => number * 2;
console.log(`4 doubled is ${double(4)}`);
// 省略 {} 将省略 return 语句
const numbers = [1, 2, 3, 4, 5];
const doubleNumbers = numbers.map(number => number * 2);
console.log(`Double of ${numbers} is ${doubleNumbers}`);4. 结语
() => {} 形式的函数是 ES6 箭头函数的进一步简化，使 JavaScript 代码更加优雅简洁，更加符合代码简洁原则。它可以用于不需要统一指向 this 手动绑定到局部变量时的简单任务中，但也不必严格遵守约定。只要能更好地提升代码的可读性和可维护性即可，这样有助于提高代码质量和效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d6a4fca941bf7134c6bf2e