箭头函数中this的指向

最新推荐文章于 2023-03-15 10:36:34 发布

原创最新推荐文章于 2023-03-15 10:36:34 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

前端专栏收录该内容

6 篇文章

订阅专栏

本文深入探讨JavaScript中的this指向问题，特别关注箭头函数与普通函数的区别。在箭头函数中，this继承自其定义时的作用域，而普通函数的this取决于调用方式。当作为对象方法时，this指向该对象；作为构造函数，this指向新创建的对象；在严格模式的函数调用中，this为undefined。通过示例代码，我们展示了如何在不同场景下理解和使用this。

箭头函数中,不会创建自己的this，只会从自己的作用域链的上一层继承this。（注意对象不构成作用域）

普通函数中，谁在函数真正执行时调用该函数，this就指向该函数。

如果是该函数是一个构造函数，this指针指向一个新的对象
在严格模式下的函数调用下，this指向undefined
如果是该函数是一个对象的方法，则它的this指针指向这个对象

从这个角度理解下面这个例子：

var cat={
    func1:()=>{
        console.log("arrow1",this);//指向window
    },
    func2:function(){
        console.log("average",this);//指向cat
        var func3=()=>{
            console.log("arrowIn",this);//指向cat
        }
        func3();
    }

}
cat.func1();
cat.func2();
var funn=cat.func2;
funn(); //func2和func3里面的this都指向window