首页IT科技this指针用法(JavaScript:this指针)

this指针用法(JavaScript:this指针)

时间2025-09-19 10:30:51分类IT科技浏览6087
导读:this指针,存储的是一个内存地址,如同变量一样,指向一块内存区域;...

this指针                 ,存储的是一个内存地址                        ,如同变量一样        ,指向一块内存区域;

而这个内存区域         ,保存的就是一个对象的数据                        ,那么这个对象是什么呢?

通常来说                ,this指针         ,主要是用在方法(函数)中                         ,用来指向调用方法(函数)的对象;

比如说                ,有个方法eat(),这个方法里面有个this指针;

当Tom调用eat时                         ,this指针指向的就是"Tom";

当Jerry调用eat时                        ,this指针指向的就是"Jerry";

也就是说,this指针                 ,总是指向直接调用者                。

好                        ,现在我们来看一下        ,两个不同于上面所述规则的特殊情况:

                ”没有“调用者

看下面代码:

我们知道                 ,如果是使用var声明的变量                        ,实际上是成为了window对象的方法        ,那么aaa()实际上就是window.aaa()         ,也就是省略了window的写法                        ,那么                ,this指向的就是window对象         ,我们可以理解;

但是                         ,上面我们使用let声明的变量                ,为什么this指向的还是window对象呢?

要知道,let声明的函数                         ,并不是window对象的方法                        ,window对象也无法调用,那么此时aaa()是由谁调用的呢?我们现在无法得知                 ,但是可以肯定的是                        ,绝对不是window对象;

再来看函数aab()        ,虽然它是function声明的函数                 ,但是因为它是在代码块中声明的                        ,所以它也不是window对象的方法        ,那么aab()又是被谁调用的呢?为什么它的this指针         ,也指向window对象呢?

事实上                        ,这是历史遗留问题                ,如果我们开启了严格模式         ,此时两个this将都会是undefined                         ,这是符合逻辑的                ,既然“没有                         ”调用者,那么this就没有指向                         ,当然就是undefined;

如下所示                        ,就印证了我们前面所说的:

箭头函数没有this指针

首先说明,箭头函数                 ,确实没有自己的this指针;

也就是说                        ,箭头函数里面的this        ,并不能指向调用箭头函数的对象;

那么                 ,此时this                        ,指向的是谁呢?

看下面代码:

我们将上图与上上图进行比较        ,仔细观察一下输出结果的不同;

在严格模式下         ,上图三个this指向的都是window对象                        ,与上上图完全不一样                ,这至少说明         ,箭头函数的this                         ,和function声明的函数的this                ,有不同的表现;

再看下面这个代码:

上图与上上图的区别,就是在最后一行代码                         ,我们将obj1作为obj2的一个对象                        ,从而再多一次调用arrow()方法,结果依然还是指向window对象                 ,似乎无论增加多少次中间调用者                        ,最终都会指向window对象        ,说明箭头函数的this                 ,并不是在指向调用箭头函数的对象;

现在我们尝试                        ,将箭头函数arrow的可见性        ,降低一些         ,看下面的代码:

上图将箭头函数内arrow的可见性                        ,控制在了用关键字function声明的函数外arrow内部                ,这样         ,要使用箭头函数                         ,就得调用外arrow;

对于arrow()                ,上面我们已经讨论过,此时外arrow函数“没有        ”调用者                         ,所以this是undefined;

对于obj1.arrow()                        ,此时this指向,调用外arrow函数的obj1;

对于obj2.arrow()                 ,此时this指向                        ,调用外arrow函数的obj2;

对于obj2.obj1.arrow()        ,此时this指向                 ,调用外arrow函数的obj1                        ,注意        ,此时obj2调用obj1         ,而obj1调用外arrow函数                        ,所以this指向obj1;

可以看到                ,this的表现         ,完全就是外arrow函数的this指针的表现;

也就是说                         ,此时                ,箭头函数的this,其实并不属于箭头函数                         ,而是属于包围箭头函数的外部代码块                        ,在这里也就是指外arrow函数;

所以,在考虑箭头函数的this指针的指向的时候                 ,我们完全可以把箭头函数当成一般的执行语句                        ,而不是一个函数        ,这也是为什么说箭头函数没有this指针的缘故;

现在回过头看上上图                 ,我们就能理解                        ,此时箭头函数是直接在script标签中的        ,作为一个普通的执行语句         ,它的外层只剩下浏览器窗口                        ,也就是window对象了                ,所以这些this指针才全部指向window对象;

总结:

this指针         ,总是指向它所在函数体的直接调用者; 直接函数名()这样“没有                ”调用者的函数调用                         ,在严格模式下                ,this为undefined;在普通模式下,this指向window对象; 箭头函数没有this指针                         ,此时将箭头函数当做一般语句                        ,this指针属于箭头函数所在的函数体的直接调用者;而且注意,如果箭头函数是全局作用域的话                 ,无论什么模式                        ,this总是指向window对象;

创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!

展开全文READ MORE
error in connection establish(ERROR Connection is readonly. venus224 ITeye技术网站)