箭头函数与普通函数以及this指向问题

（1）箭头函数使用会更加简洁

没有参数只有单条语句

var  fun=()=>consoloe.log("1");
fun();

一个参数单条语句，可以省略（）

var fun=a=>console.log("1");//a就是传入的单个参数

多个参数多条语句

var fun=(a,b)=>{consoloe.log("1");return a+b;}

返回的是对象要加{}

var fun=()=>({foo:x})

（2）箭头函数是匿名函数不能作为构造函数，创建new实例对象

var B=()=>return 1;  var b=new B()；//error,B ji not a constructor

（3）普通函数可以使用arguments进行传参和读取参数，但是箭头函数使用rest

function test(a){console.log(arguments)};//1
test(1)
let test1=(...a)=>consoloe.log(a[1])//1
test1(2,1,3)

（4）箭头函数没有原型属性

console.log(test.prototype)//object{}
console.log(test1.prototype)//undefined

（5）箭头函数不能换行

let test1=(...a)=>
                       consoloe.log(a[1])
//error

（6）this不同

箭头函数没有this,他的this会向上下文去找而不是本身的this,传统函数的this谁调用就是谁
也可以说传统函数的this是调用时候产生的，谁调用就是指向谁
箭头函数的this是函数定义时候产生的，this是继承自父执行上下文，并不会因为谁调用了这个函数而改变，所以箭头函数的this不会改变

比如下面的arrowFn中的this，箭头函数本身与arrowFn平级，也就是箭头函数本身所在的对象就是obj,obj的父执行上下文就是window，所以这里的this指向的就是window

<script>
    var str = 'window';
    const obj={
        str:"obj",
        nativeFn:function(){
            console.log("nativeFN:",this.str);
        },
        arrowFn:()=>console.log("arrowFn:",this.str)

    }
    obj.nativeFn();//输出obj
    obj.arrowFn();//输出window

</script>

此外无论箭头函数的this指向一旦生成就不会更改不会因为谁调用而更改this指向

call() apply bind也不会影响this的指向