查看: 591|回复: 0

[JavaScript/JQuery] javascript this对象

发表于 2017-10-4 09:23:00
尚学堂AD

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

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

this对象的指向

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

1、纯粹的函数调用

  例如

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

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

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

  1. var x = 2;
  2. function test(){
  3. var x = 1;
  4. function error(){
  5. alert(this.x);
  6. }
  7. return error;
  8. }
  9. test(); // 2
复制代码

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

2、作为对象的方法调用

  例如

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

这边的this指向的是对象demo

还有个迷惑性的例子

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

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

  1. 1 (demo.error())();  //把()里的看成一个函数,其实调用这个函数的还是全局对象global
复制代码

或者再换种写法

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

3、作为构造函数调用

  例如

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

这边的this就指向新对象o

4、call()和apply()时

  例如

  

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

当使用call和apply时,()中的对象是什么,this就指向什么对象



回复

使用道具 举报