this 的指向有几种情况:
- 全局对象(指向 window);
- 作为普通函数调用(指向 window);
- 作为对象方法调用(一般指向该对象);
- 构造器调用(一般指向构造器函数);
- Function.prototype.call 或 Function.prototype.apply 调用(指向 Function)。
1. 全局对象的this
1 console.log(this); // this指向于window 2 3 function test(){ 4 console.log(11); 5 } 6 setTimeout(function(){ 7 console.log(this === window); // true 8 this.test(); // 11 9 }); 10 //setTimeout() 和 setInterval()函数内部的 this 指针是指向于 window 的
2. 作为普通函数调用
1 var name = "longen"; 2 function test(){ 3 return this.name; 4 } 5 console.log(test()); // longen
3. 作为对象方法调用
1 var obj = { 2 "name": "我的名字改了", 3 getName: function(){ 4 console.log(this); // 在这里this指向于obj对象了 5 console.log(this.name); // 打印 我的名字改了 6 } 7 }; 8 obj.getName(); // 直接调用对象方法
以上是直接调用对象方法时,this 指向该对象,但是我们不能像下面这样调用对象的方法,运行函数 yunxi() 时就相当于调用了普通函数,这时 this 会指向 window :
1 var name = "全局对象名字"; 2 var obj = { 3 "name": "我的花名改为云溪了,就是为了好玩", 4 getName: function(){ 5 console.log(this); // window 6 console.log(this.name); // 全局对象名字 7 } 8 }; 9 var yunxi = obj.getName; 10 yunxi();
4. 构造器调用
在 Javascript 中不像 Java 一样,有类的概念,在 JS 中只能通过构造器创建对象,当 new 运算符调用函数时,该函数会返回一个对象,一般情况下,构造器里面的 this 就指向返回的这个对象;
1 var Test = function(){ 2 this.name = "xiao"; 3 }; 4 var test = new Test(); 5 console.log(test.name); // xiao
注意:构造器函数第一个字母需要大写,这是为了区分普通函数和构造器函数。
但是也有例外的情况,当构造器返回了一个对象时,此时继续调用,this 指向返回的那个对象:
1 var obj = function(){ 2 this.name = "xiao"; 3 return { 4 "age": "27" 5 } 6 }; 7 var test = new obj(); 8 console.log(test.name); // undefined,此时 this 指向返回的对象,对象里只有 age 属性,所以返回 undefined
学习资源:javascript中的this详解
时间: 2024-10-28 22:21:11