当前位置: 代码迷 >> 综合 >> es6箭头函数与普通函数的区别
  详细解决方案

es6箭头函数与普通函数的区别

热度:18   发布时间:2024-01-28 14:43:02.0

this指向的区别

普通函数:一般指向它的直接调用者,如果没有调用者(严格模式下)undefined,默认模式下(非严格模式下),指向Window

如果需要明确绑定this的指向

1.通过在外部先将this的值赋值给一个临时变量(var that =this)

示例:

var obj ={

a:1,

foo=function(){

var that=this;

setTimeOut(function(){console.log(that.a)},3000)}

}

2.通过bind()来绑定this

示例:如果没有bind(this),function里面的this是undefined

var obj ={

a:1,

foo=function(){setTimeOut(function(){console.log(this.a)}.bind(this),3000)}

}

箭头函数写法:

()=>{console.log(this)}

箭头函数:

箭头函数中的this始终指向父级作用域中的this,会捕获上下文中的this作为自己的this(沿着作用域链向上寻找),任何方法无法更改其指向(call()、bind()、apply())

 

相当于匿名函数,不能用new来作为构造函数使用,没有自己的this,arguments(传递给函数的参数的类数组对象),new target(ES6,new.target属性允许你检测函数或构造方法是否是通过new运算符被调用的,在通过new运算符被初始化的函数或构造方法中,new.target返回一个指向构造方法或函数的引用。在普通的函数调用中,new.target 的值是undefined--MDN)

和 super(ES6,super作为函数调用时,代表父类的构造函数;super作为对象时,在普通方法中,指向父类的原型对象;在静态方法中,指向父类。)

 

其他区别

箭头函数相当于匿名函数,并且简化了函数定义

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

箭头函数不绑定arguments,取而代之用rest参数…解决(es6引入剩余参数)

箭头函数没有prototype(原型),所以箭头函数本身没有this

 待补充;

  相关解决方案