箭头函数与传统JavaScript的不同

之前写过“箭头函数:我只是this的搬运工”,这次更好的总结下。

箭头函数与传统JavaScript的不同之处,主要集中在一下几点:

1. 没有this,super,argumentsnew.target绑定。

箭头函数的中的this,super,argumentsnew.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.不支持重复的命名参数

无论在严格还是非严格模式下,箭头函数都不支持重复的命名参数:而在传统函数的规定中,只有在严格模式下才不能有重复的命名参数。

    原文作者:打铁大师
    原文地址: https://www.jianshu.com/p/7c44868ec34b
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞