什么是箭头函数？

箭头函数允许我们用更短的语法定义函数。箭头函数可用于替代传统函数function() {}。

语法
允许写的函数，在2号取为参数a和b，然后返回的总和。

作为常规功能：

function sum(a, b) {
   return a + b
}
1
2
3

现在，作为箭头函数：

const sum = (a, b) => a + b
1

您可以清楚地看到语法缩短了多少。

使用箭头函数时，参数位于一对括号中的开头。然后是 a =>，它声明了一个箭头函数。之后，您将输入{}您希望运行的任何代码。但是，在返回值时，您可以排除花括号。

此外，如果只有一个参数，您可以排除它周围的括号。

这看起来像这样：

const addOne = num => num + 1
1

如果您的函数没有参数，您只需使用一对空括号，后跟通常的。像这样：

const sayHello = () => {
   console.log("Hello")
}
1
2
3

箭头函数可用于替代任何函数用例。例如，在 React 中，您可以使用箭头函数来定义功能组件而不是常规函数。

另一个用例可能是作为回调函数。例如，如果我们有一个看起来像这样的用户数组：

const users = [
   {
      name: "John",
      age: 24
   },
   {
      name: "Jane",
      age: 32
   },
   {
      name: "Blake",
      age: 12
   }
]
1
2
3
4
5
6
7
8
9
10
11
12
13
14

我们想使用 JavaScript.filter方法来选择 18 岁以上的用户：

const adults = users.filter(user => user.age > 18)
1

这是箭头函数可以显着减少您必须编写的代码量的一种用例。这也适用于其他数组方法.map，例如：
更改this关键字
在标准函数中，this关键字代表调用函数的对象，可以是按钮，甚至是文档。但是，在箭头函数中，this关键字表示定义箭头函数的对象，而不是调用该函数的元素/对象。