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

 

箭头函数在一定程度上简化了普通函数的写法，但是在一些特殊的用法上箭头函数并不能够代替普通函数，他们的几点区别如下：

1. 箭头函数不创建自己的this（重要），所以它没有自己的this，它只会从自己的作用域链的上一层继承this。

   this.num = 2;
   const a = {
       num: 1,
       foo: function () {
           console.log(this);//{ num: 1, foo: [Function: foo],  foo1: [Function: foo1]}
           console.log(this.num);//1
       },
   　　 foo1: ()=> {
   　　    console.log(this);//{num:2}
   　　    console.log(this.num);//2
       }
   }
   a.foo();
   a.foo1();

   普通函数作为对象的方法调用时，this指向它所属的对象。因此foo方法中this.num指向的是a.num，箭头函数中的this指向是全局执行环境中的this，它的this指向的就是全局中this.num

2. .call()/.apply()/.bind()无法改变箭头函数中this的指向

   a.foo.call({num:3});
   a.foo1.call({num:3});

   同样用上面的例子来说明，普通函数的this.num会变成3，而箭头函数的this永远指向的是全局环境中的this，因此它的值永远都是2

3. 箭头函数没有自己的arguments

4. 箭头函数不能作为构造函数使用　态指向被点击的按钮对象