this一直是JS的一个难点,它有点像python中的self,总的来说代表的是调用环境的上下文。但是它会随着调用方式的不同而导致指向不同:
1.在方法中,this 表示该方法所属的对象。
2.如果单独使用,this 表示全局对象。
3.在函数中,this 表示全局对象。
4.在函数中,在严格模式下,this 是未定义的(undefined)。
5.在事件中,this 表示接收事件的元素。
6.类似 call() 和 apply() 方法可以将 this 引用到任何对象。
7.在被构造器函数调用时,如果构造函数返回的不是对象,代表的是新建立的构造器,如果返回的是对象,那么传入构造器函数的this将被丢弃。
下面的例子:
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};
alert(object.getNameFunc()());
this虽然在方法getNameFunc内,但是它的调用方式是return返回的函数调用,所以this指的是全局对象windows,输出是"The Window",作为对比,下面的例子:
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
};
alert(object.getNameFunc()());
this所在函数是作为getNameFunc方法调用,所以期指向object,因为闭包的原因内部函数可以访问所在环境的变量和参数,所以最终输出为"My Object"。
第7点的例子如下:
var puppet = {
rules: false
};
function Emperor() {
this.rules = true;
this.name = "bao"
return puppet;
}
var emperor = new Emperor();
console.log(emperor.name);
console.log(emperor.rules);
因为Emperor构造器函数返回的是puppet对象,所以this所指向的emperor被抛弃,所以结果输出为undefined和false。Emperor构造器函数如果没有return puppet这一句,结果输出为bao和true。如果Emperor构造器函数返回的不是一个对象类型,则忽视返回值,返回新创建的对象,比如return puppet改成return 1,那么emperor等于一个Emperor对象,而不是1。