之前写过“箭头函数:我只是this的搬运工”,这次更好的总结下。
箭头函数与传统JavaScript的不同之处,主要集中在一下几点:
1. 没有this
,super
,arguments
和new.target
绑定。
箭头函数的中的this
,super
,arguments
及new.target
这些值由外围最近一层非箭头函数决定。
这句话的意思是,箭头函数内的能访问到的这些值,其实都是来自于外围的最近一层非箭头函数内的值。
举个例子:
let person = {
name :'noshower',
getName(){
let self = this;
let fn = () => console.log(this === self);
fn();
}
}
person.getName();
//result : true
上面这个例子中,箭头函数内的this与外围的非箭头函数中的this值相等。
2. 不能通过new
关键字调用
箭头函数没有[[Construct]]
方法,所以不能被用作构造函数,如果通过new
关键字调用箭头函数,程序会抛出错误。
let F = () => {}
new F();
//result: TypeError: F is not a constructor
3.没有原型
由于不可以通过new
关键字调用箭头函数,因而没有构建原型的需求,所以箭头函数不存在prototype
这个属性。
4. 不可以改变this
的绑定
函数内部的this
值不可被改变,在函数的生命周期内始终保持一致。
箭头函数:我连new都放弃,还要prototype干嘛!!!
5. 不支持arguments
对象。
箭头函数没有arguments绑定,所以你必须通过命名参数和不定参数这两种形式访问函数的参数。
在未来无论函数在哪个上下文中执行,箭头函数始终可以访问外围函数的arguments对象。
举个例子:
let f = function returnArgument(){
return ()=> arguments;
}(1,2,3);
console.log(f());
// result: { '0': 1, '1': 2, '2': 3 }
上面这个例子,给箭头函数的外围非箭头函数传入3个参数,然后返回箭头函数,再调用,结果表明,箭头函数可以访问外围函数的arguments对象。
6.不支持重复的命名参数
无论在严格还是非严格模式下,箭头函数都不支持重复的命名参数:而在传统函数的规定中,只有在严格模式下才不能有重复的命名参数。