箭头函数与普通函数区别

 箭头函数：

        

let fun = () => {
    console.log('lalalala');
}

普通函数：

        

function fun() {
    console.log('lalla');
}

    箭头函数的出现就是为了解决ES5中this指向混乱的问题

    箭头函数的this指向来自父级上下文, 箭头函数没有自己的this

     箭头函数的this不会在调用的时候被改变, 在箭头函数声明的时候他的this就已经被永久的确定

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

//箭头函数与普通函数的区别
    //1.箭头函数是匿名函数 箭头函数不能作为构造函数使用 不能使用new
    //2.箭头函数的this,始终指向父级上下文
    //3.箭头函数不能通过call apply bind改变this指向,但是可以通过这些方法传递参数
    //4.箭头函数没有原型属性
    //5.箭头函数没有arguments属性,可以用...展开运算符来接收所有的参数集合
  

  

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

let FunConstructor = () => {
    console.log('lll');
}

let fc = new FunConstructor();

箭头函数没有arguments属性,可以用...展开运算符来接受所有的参数集合

{
       /* function fn(){
            console.log(arguments);
            // fn.caller 谁在调用当前的方法 会返回这个方法本身
            // arguments.callee ===> 当前这个方法本身;
            // arguments 参数集合 是一个类数组 不能调用数组的方法
        }
        fn(1,2,3)*/

        let fn = (...args)=>{ //使用展开运算符接受参数集合
            // console.log(arguments);// arguments is not defined
            console.log(args); //是一个数组
        }
        fn(1,2,3)
    }

//箭头函数没有原型属性
    {
        // function fn(){}
        let fn = ()=>{};
        console.dir(fn);
    }

//箭头函数不能通过call apply bind改变this指向,但是可以通过这些方法传递参数
    {
        let obj = {
            name: "obj",
            birth: 1990,
            year: 2021,
            age: (arg1, arg2)=>{
                console.log(this);//window
                console.log(arg1, arg2);//obj2
                console.log("my age =", this.year - this.birth)
            }
        }
        let obj2 = {
            name: "obj2",
            birth: 2000,
            year: 2020,
        };
        obj.age.call(obj2,"参数1","参数2")
    }