箭头函数()=>是什么,有什么用?

箭头函数就是采用箭头=>来定义函数,省去关键字function。
函数的参数放在=>前面的括号中,函数体跟在=>后的花括号中。

// 箭头函数
let fn = (name) => {
    // 函数体
    return `Hello ${name} !`;
};

// 等同于
let fn = function (name) {
    // 函数体
    return `Hello ${name} !`;
};

注意点:

1、形参个数如果为1个,可以省略小括号不写;

//只有一个参数,可以省去参数括号
    let fn = name => {
        console.log(`hello ${name}!`)
    };

2、如果函数体里面只有一个语句,可以省略大括号不写, 并且他会默认返回 => 符号后面的数据。

//返回某个简单变量val
let f = val => val;
// 等同于
let f = function (val) { return val };


//返回一个简单的js表达式num1+num2
let sum = (num1, num2) => num1 + num2;
// 等同于
let sum = function(num1, num2) {
  return num1 + num2;
};


3、如果函数体有多个语句,则不能省略大括号。

let fn = (val1, val2, val3, val4) => {
    return [val1, val2, val3, val4];
}

4、如果函数体只有一个语句,且返回一个对象,建议是,不要写简写的方式。

//错误写法—花括号会被解释为函数体,如果箭头函数的函数体只有一句代码,返回的不是变量和简单的js表达式,而是一个对象。
    let getItem = id => {
        id: id,
        name: 'gaby'
    };
//正确写法
    let getItem = id => ({
        id: id,
        name: 'gaby'
    });

箭头函数没有自己的作用域,即箭头函数 this 指向其外层作用域。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值