什么是箭头函数?

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

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

作为常规功能:

function sum(a, b) {
   return a + b
}

现在,作为箭头函数:

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

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

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

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

这看起来像这样:

const addOne = num => num + 1

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

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

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

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

const users = [
   {
      name: "John",
      age: 24
   },
   {
      name: "Jane",
      age: 32
   },
   {
      name: "Blake",
      age: 12
   }
]

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

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

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

阅读终点,创作起航,您可以撰写心得或摘录文章要点写篇博文。去创作
  • 38
    点赞
  • 93
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

丙音

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值