美文网首页
箭头函数和function的区别

箭头函数和function的区别

作者: xiaojingy | 来源:发表于2020-09-08 14:11 被阅读0次

    1、写法不同

    let foo = () => {
      console.log('foo');
    }
    function foo(){
      console.log('foo');
    }
    

    2、this的指向不一样
    使用function定义的函数,this的指向随着调用环境的变化而变化的,而箭头函数中的this指向是固定不变的,一直指向的是定义函数的环境。
    3、构造函数

     //使用function方法定义构造函数
    function Person(name, age){
        this.name = name;
        this.age = age;
    }
    var lenhart =  new Person(lenhart, 25);
    console.log(lenhart); //{name: 'lenhart', age: 25}
    
    //尝试使用箭头函数
    var Person = (name, age) =>{
        this.name = name;
        this.age = age;
    };
    var lenhart = new Person('lenhart', 25); //Uncaught TypeError: Person is not a constructor
    

    4、变量提升
    由于js的内存机制,函数声明的时候存在变量提升,

    foo()  // foo
    function foo(){
      console.log('foo') 
    }
    
    fn() //Uncaught TypeError: fn is not a function
    let fn = () => {
      console.log('fn');
    }
    

    相关文章

      网友评论

          本文标题:箭头函数和function的区别

          本文链接:https://www.haomeiwen.com/subject/cqelektx.html