javascript this对象

Posted 2020-10-07 铸剑师

函数运行时，自动生成的一个内部对象，只能在函数内部使用

随着函数使用场合的不同，this的值也发生着改变，但是有一个总原则：this指的是调用函数的那个对象（核心）

 

this对象的指向

一般情况下，我们会从以下四个方面去分析

1、纯粹的函数调用

　　例如

1 function test(){
2         this.x = 1;
3         alert(this.x);
4         this.x = 2;
5 }
6 test();     //   1
7 alert(x);    //    2

所以在这边，this指的是全局对象global

这边还有一种情况，很多人会搞错

var x = 2;
    function test(){
        var x = 1;
        function error(){
            alert(this.x);
        }
        return error;
}
test();    //    2

这种情况下this依旧是全局对象global，因为调用它的依旧是全局对象

 

2、作为对象的方法调用

　　例如

1 var demo = {
2         x:1,
3         error : function () {
4             var x = 2;
5             alert(this.x)
6         }
7 };
8 demo.error();    //    1

 

这边的this指向的是对象demo

 

还有个迷惑性的例子

 1     var x = 3;
 2     var demo = {
 3         x:1,
 4         error : function () {
 5             var x = 2;
 6             function ss(){
 7                 alert(this.x);
 8             }
 9             return ss;
10         }
11     };
12     demo.error()();    //     3

 

这边的this又指向全局对象了.....换种方式看也许更清晰

1 (demo.error())();　　//把（）里的看成一个函数，其实调用这个函数的还是全局对象global

 

或者再换种写法

 1　　　var x = 3;
 2     var demo = {
 3         x:1,
 4         error : function () {
 5             var x = 2;
 6             function ss(){
 7                 alert(this.x);
 8             }
 9             ss();        // 3    不管函数在哪边，只要调用它是全局对象，那么this就指向全局对象
10         }
11     };
12     demo.error();    //     3

 

 

 

3、作为构造函数调用

　　例如

1     function test(){
2         this.x = 1;
3     }
4     var o = new test();
5     var x = 2;
6     alert(o.x);    //    1     

 

这边的this就指向新对象o

 

4、call()和apply()时

　　例如

　　

 1     var x = 3;
 2     var o = {
 3         x:1
 4     };
 5     var v = {
 6         x:2,
 7         test:function () {
 8             return this.x;
 9         }
10     };
11     alert(v.test());    //  2   this指向v
12     alert(v.test.call());   // 3    this指向全局
13     alert(v.test.call(o));  // 1    this指向o

 

当使用call和apply时，（）中的对象是什么，this就指向什么对象