普通函数与箭头函数函数

箭头函数与普通函数区别

箭头函数就是解决了普通函数中的指向问题

一、箭头函数是匿名函数,不能作为构造函数,不能使用new

在这里插入图片描述
箭头函数相当于匿名函数,并且简化了函数定义。箭头函数有两种格式:一种只包含一个表达式,连{…}和return都省略掉。还有一种可以包含多条语句,这时候不能包含{…}和return。

不能作为构造函数,不能使用new

在这里插入图片描述
在这里插入图片描述

二、箭头函数内没有arguments。可以用展开运算符...解决

在这里插入图片描述

三、箭头函数的this,始终指向父级上下文(箭头函数this取决于定义位置父级上下文,跟使用位置没关系,普通函数this指向调用的那个对象)

var a=200;

let obj={
    
    
    a:100,
    fn:function(){
    
       //es5 谁调用,this指向谁
        console.log(this.a);
    },![在这里插入图片描述](https://img-blog.csdnimg.cn/20200929152633364.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzODk2OA==,size_16,color_FFFFFF,t_70#pic_center#pic_center)

    foo:()=>{
    
       //  es6箭头函数的this指向父级(obj)上下文。
        console.log(this.a)
    }
}


obj.fn();// 100;  
obj.foo();//200

四、箭头函数不能通过call()、apply()、bind()方法直接修改它的this指向。(call、apply、bind会默认忽略第一个参数,但是可以正常传参)

在这里插入图片描述

五、箭头函数没有原型属性

在这里插入图片描述

总结

箭头函数是es6为了解决this指向问题而出的,从它的长相上看呢,他是一个匿名函数,且不能作为构造函数,所以不能new。箭头函数没有arguments ,但是可以用展开运算符(...)来解决,箭头函数this始终指向父级上下文,如果没有父级上下文就指向windows,箭头函数不能通过call()、apply()、bind()来直接改变this指向,会默认忽略第一个参数,但是可以正常传参,箭头函数没有原型属性。

猜你喜欢

转载自blog.csdn.net/weixin_50407990/article/details/110091338
今日推荐