资讯专栏INFORMATION COLUMN

关于js中this指向的总结

mcterry / 1061人阅读

摘要:中指向问题一直是个坑,之前一直是懵懵懂懂的,大概知道一点,但一直不知道各种情况下指向有什么区别,今天亲自动手测试了下的指向。这就是我关于学习的总结,希望能给需要的人点帮助,然后有啥不足希望有大神能指点出来。

js中this指向问题一直是个坑,之前一直是懵懵懂懂的,大概知道一点,但一直不知道各种情况下指向有什么区别,今天亲自动手测试了下this的指向。
1.在对象中的this
对象中的this指向我们创建的对象,例如:

var obj ={
    ccc : 1122,
    ffffd : 2233,
    ded : function(){
            console.log(this);
        }  ,
    fff : function(){
            console.log(this === obj );
        }
}
obj.ded();
obj.fff();

在chrome中执行的答案如下:

上图我们可以看出我们执行obj对象下的ded函数时,打印出来的事Object对象里面的所有属性,展示这个对象

可以看到obj对象包含的方法和属性都包含在this对象下面,再运行fff函数,把this和obj对象进行比较,可以看出这两个是恒等的,所以在对象里的this指向这个对象。

2.直接调用函数时的this指向
先创建一个函数:

function main(){
    this.aad = 234;
    console.log(this);    
}
main();

运行效果如下:

可以看到我们打印出来的this对象指向全局变量window,而创建的aad变量直接包含在了window对象下面了,所以直接调用函数时this是指向window对象的。

3.构造函数中的this指向
当我们创建一个构造函数时,并且实例化一个对象时,this的指向哪里呢?先创建一个函数

function main(){
    this.aad = 234;
    this.def = function(){
                console.log(this);
            };
    this.foo = function(){
            console.log(this === xxx);
        };
    this.xoo = function(){
            console.log(this === main);
        };
}
var xxx = new main();
xxx.def(); 
xxx.foo();
xxx.xoo();

可以看出xxx.def函数还是指向main函数,但这只是把上下文给打印出来了,但当我们打印this与构造函数以及实现对象比较时就可以看出区别了,与构造函数main比较出来的值是false;与xxx函数比较时显示是true,所以构造函数this事指向当前实例化对象的。

这就是我关于this学习的总结,希望能给需要的人点帮助,然后有啥不足希望有大神能指点出来。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/49769.html

相关文章

  • 关于jsthis指向总结

    摘要:中指向问题一直是个坑,之前一直是懵懵懂懂的,大概知道一点,但一直不知道各种情况下指向有什么区别,今天亲自动手测试了下的指向。这就是我关于学习的总结,希望能给需要的人点帮助,然后有啥不足希望有大神能指点出来。 js中this指向问题一直是个坑,之前一直是懵懵懂懂的,大概知道一点,但一直不知道各种情况下指向有什么区别,今天亲自动手测试了下this的指向。 1.在对象中的this对象中的t...

    zhangfaliang 评论0 收藏0
  • This 指针--深思

    摘要:当代码在一个环境中执行时,会创建变量对象的一个作用域链。可以指向不同的运行环境,这里的运行环境本质上指的是对象,可以是内建对象自定义对象或者全局对象。 今天早上看到公众号推送了阮一峰老师的文章JavaScript 的 this 原理,文章不是很长于是研究了一下。 看完自己的总结如下: this this 指向函数运行时所在的环境。 函数运行在对象内,this 就指向该对象 运行在全局...

    ernest.wang 评论0 收藏0
  • 关于javascript类特性一些总结

    摘要:被克隆的对象称之为新对象的原型,新对象保存一个指向其原型的引用。一个对象是如何与其原型联系起来的呢答对象的属性指向其构造函数的。如何实现继承呢使构造函数的等于另一个构造函数的一个实例这样就使得继承于。 众所周知,在javascript这门动态类型语言中,是不存在如传统静态类型语言如c++或java中对类的支持的。后者是天生为面向对象编程而设计,其中涉及的一些概念如继承、多态、函数重载在...

    sunsmell 评论0 收藏0
  • jsthis总结

    摘要:关于的指向问题算的上是中的一个十分重要的问题了。首先,的指向问题可以用一句话总结就是总是指向调用的对象,也就是说指向谁与函数声明的位置没有关系,只与调用的位置有关。此外注意几种特殊情况,特别是中的箭头函数。 关于this的指向问题算的上是js中的一个十分重要的问题了。今天把这个问题总结下,加深下自己对this的理解。首先,this的指向问题可以用一句话总结就是:this总是指向调用的对...

    light 评论0 收藏0

发表评论

0条评论

mcterry

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<