由于运行期绑定的特性,JavaScript 中的 this 含义非常多,它可以是全局对象、当前对象或者任意对象,这完全取决于函数的调用方式
随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象
如果直接调用这个函数里的this 这个this就是Windows
在函数被直接调用时this绑定到全局对象。在浏览器中,window 就是该全局对象
console.log(this);
function fn1(){
console.log(this);
}
fn1();
这个this就是Windows
内部函数
函数嵌套产生的内部函数的this不是其父函数,仍然是全局变量
function fn0(){
function fn(){
console.log(this);
}
fn();
}
fn0();
这里的this还是Windows 背下来就完事了
在setTimeout、setInterval中
document.addEventListener('click', function(e){
console.log(this);
//这里的this是document
setTimeout(function(){
console.log(this);
}, 200);
}, false);
如果出现了回调函数那么这个this 80-90%都会变掉
作为构造函数调用
所谓构造函数,就是通过这个函数生成一个新对象(object)。这时,this就指这个新对象
new 运算符接受一个函数 F 及其参数:new F(arguments...)。这一过程分为三步:
1 创建类的实例。这步是把一个空的对象的 proto 属性设置为 F.prototype 。 初始化实例。
2 函数 F 被传入参数并调用,关键字 this 被设定为该实例。
3 返回实例。
举个例子
function Person(name){
this.name = name;
//这里的this就是P1
}
Person.prototype.printName = function(){
console.log(this.name);
//这里的this还是其调用的对象P1
};
var p1 = new Person('Byron');
var p2 = new Person('Casper');
var p3 = new Person('Vincent');
p1.printName();
p2.printName();
p3.printName();
作为对象方法调用
看例子
var obj1 = {
name: 'Byron',
fn : function(){
console.log(this);
//这里还是obj1调用了这个函数所以这个this就是obj1
//注意调用this不要重名不然很有可能把属性覆盖掉
}
};
obj1.fn();
小陷阱
var fn2 = obj1.fn;
fn2();
注意这里打印的this绝对就是windows 因为讲其引用给了FN2所以导致了
地址的变更所以这里的THIS就是Windows