箭头函数

匿名函数可以用箭头函数来写

{
        //没有参数的情况下,得加上小括号
        setTimeout(()=>console.log(1),100);//1
        //有一个参数的情况下,可以省略小括号
        let f=x=>x;
        console.log(f(2));//2
        //大于一个参数情况下要加上小括号
        let name=(x,y)=>x+y;
        console.log(name(2,3));//5
        //如果箭头函数里只是一条语句,可以省略大括号,并且自动加上return

}
{
        //如果箭头函数里大于一条语句,就跟平时写的函数一样,
        let a;
        let show = x => {
            a=x;
            console.log(a);//3
            return a;
        };
        console.log(show(3));//3
}
{
        //如果需求只要return一个json对象,并且是一条语句,那么需要加上小括号
        let f=(x,y)=>({x:x,y:y});
        console.log(f(2,3));
}

使用箭头函数需要注意的几点

  • 1 箭头函数没有自己的this,用的是上级的this,这在回调函数当中非常有用,因为箭头函数没有自己的this,所以bind方法无效,内部的this指向外部的this
{
        let a=0;
        let json={
            a:9,
            b:function (){
                setTimeout(()=>{
                    console.log(this.a);//9
                },100);
            }
        }
        json.b();
}
{
        let f=()=>this;
        console.log(f.call({a:3}));//window
}
  • 2 不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
{
        let json={
            a:2,
            b:()=>{
                console.log(arguments);
            }
        };
        //json.b(1,2,3);// arguments is not defined
}

用rest代替arguments

{
        let json={
            a:2,
            b:(...arr)=>{
                console.log(arr);
            }
        };
        json.b(1,2,3);// [1, 2, 3]
}
  • 3因为箭头函数没有自己的this,所以不能使用构造函数,否则会报错

箭头函数就介绍这么多了,希望能帮助大家更好的初步了解,想看更详细的资料请狠狠的点击我

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。请看下面这个例子: 输出undefined是...
    zenggo阅读 1,057评论 0 50
  • 箭头函数与传统JavaScript的不同 先来谈谈ES5中的this 在ES5中,每个函数在被调用时都会自动取得t...
    打铁大师阅读 1,307评论 4 21
  • 前言 最近学习了慕课网上的vue仿饿了吗的视频,体会到了es6的箭头函数的妙用,因此特别总结了一下箭头函数的用法。...
    破浪_阅读 414评论 0 3
  • 如需转载请注明来源,喜欢的朋友们点个赞,蟹蟹~~~ 如有错误,请批评指正! 关键词:()=>{},this 先看一...
    枸杞辣条阅读 1,188评论 0 11
  • 出了地铁口,一眼就看到高大帅气的你!而你也看到了我,迎上来拥我入怀……短暂地拥抱了下,随即拉着我的手,边说边...
    如火魅影阅读 340评论 0 0