10-JavaScript-箭头函数(ES6新)

一、语法规则

  • 箭头函数的定义使用 => 符号,左侧是参数列表,右侧是函数体。
  • 如果只有一个参数,则可以省略圆括号。但是,如果没有参数或参数超过一个,则需要用圆括号将参数列表括起来。
  • 如果函数体只有一条语句,则可以省略大括号和 return 关键字。这个语句将自动成为函数的返回值。
  • 如果函数体有多条语句,则需要用大括号将这些语句括起来,并使用 return 关键字指定返回值。
  • 箭头函数没有自己的 this,它的 this 值继承自父级作用域中的 this 值。

1、一个参数的箭头函数:

const square = num => num * num;
console.log(square(5)); // 输出结果为 25

2、多个参数的箭头函数:

const sum = (a, b) => a + b;
console.log(sum(1, 2)); // 输出结果为 3

3、函数体只有一条语句的箭头函数:

const isEven = num => num % 2 === 0;
console.log(isEven(4)); // 输出结果为 true

4、函数体有多条语句的箭头函数:

const max = (a, b) => {
  if (a > b) {
    return a;
  } else {
    return b;
  }
}
console.log(max(5, 3)); // 输出结果为 5

需要注意的是,箭头函数通常用于匿名函数表达式,因此它们经常被用作回调函数、迭代函数和事件处理程序等地方。在这些情况下,我们可以通过升级函数语法来使代码更加简洁和易读。

二、箭头函数有两种形式:一个参数和多个参数

1、一个参数:

const myFunction = (arg) => {
  // 函数体代码
}


//如果只有一个参数,甚至不需要括号:
const myFunction = arg => {
  // 函数体代码
}

2、多个参数:

const myFunction = (arg1, arg2) => {
  // 函数体代码
}

箭头函数还可以返回一个值,如果函数体只有一个表达式,则可以省略大括号与 return 关键字,并将表达式写在箭头后面:

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

console.log(sum(1, 2)); // 输出结果为 3

箭头函数的另一个重要特点是它的作用域绑定。箭头函数没有自己的 this,它的 this 值是继承自父级作用域的。这就意味着,在箭头函数内部,this 所指向的是定义箭头函数时所处的对象或上一层作用域中的 this 值。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值