JavaScript中的this引用(推荐)
this
this是javascript的一个关键字，随着函数使用场合不同，this的值会发生变化。但是总有一个原则，那就是this指的是调用函数的那个对象。
一、定义
1、this是函数内部的一个特殊对象（或this引用）--它引用的是函数据以执行的环境对象。
2、this引用是一种在JavaScript的代码中随时都可以使用的只读变量。this引用引用（指向）的是一个对象，它有着会根据代码上下文语境自动改变其引用对象的特性。它的引用规则如下：
•在最外层代码中，this引用引用的是全局对象。
•在函数内，this引用根据函数调用的方式的不同而有所不同。如下
1）构造函数的调用--this引用引用的是所生成的对象
2）方法调用--this引用引用的是接收方对象
3）apply或call调用--this引用引用的是有apply或call的参数指定的对象
4）其他方式的调用--this引用引用的是全局对象
二、根据以上所述及网上的相关资料，this对象（引用）的使用情况总结如下：
JavaScript是动态语言，this关键字在执行的时候才能确定是谁。所以this永远指向调用者，即对“调用对象”的引用。简单点说就是调用的方法属于哪个对象，this就指向那个对象。根据函数调用方式的不同，this可以指向全局对象，当前对象，或其他任意对象。
1、全局函数调用，全局函数中的this会指向全局对象window。（函数调用模式）
//代码清单1
<scripttype="text/javascript">
varmessage="thisinwindow";//这一句写在函数外面和里面是一样效果
functionfunc(){
if(this==window){
alert("this==window");
alert(message);
this.methodA=function(){
alert("I'mafunction");
}
}
}
func();//如果不调用func方法，则里面定义的属性或方法会取不到
methodA();
</script>
func()的调用结果为this==window，thisinwindow
methodA()的调用结果为I'mafunction
2、构造函数调用，即使用new的方式实例化一个对象，this会指向通过构造函数生成的对象。（构造器调用模式）
代码清单2
<scripttype="text/javascript">
functionFunc(){
if(this==window){
alert("this==window");
}
else{
alert("this!=window");
}
this.fieldA="I'mafield";
alert(this);
}
varobj=newFunc();
alert(obj.fieldA);//this指向的是对象obj
</script>
3、对象方法的调用，this指向当前对象。任何函数，只要该函数被当做一个对象的方法使用或赋值时，该函数内部的this都是对该对象本身的引用。也可理解为this写在一个普通对象中，this指向的就是对象本身。（方法调用模式）
（方法的定义：作为对象属性的函数称为方法）
//代码清单3
<scripttype="text/javascript">
varobj={
x:3,
doit:function(){
if(this==window){
alert("this==window");
}else{
alert("methodiscalled:"+this.x);
}
}
};
obj.doit();//this指向的是对象obj
</script>
4、通过apply或call方法调用，this指向传入的对象。
apply或call方法可以用来代替另一个对象调用一个方法。call方法可将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象。如果没有提供thisObj参数，那么Global对象被用作thisObj。（apply调用模式）
//代码清单4
<scripttype="text/javascript">
varobj={
x:3,
doit:function(){
alert("methodiscalled:"+this.x);
}
};
varobj2={x:4};
obj.doit();//3,this指向obj
obj.doit.apply(obj2);//4,this指向obj2
obj.doit.call(obj2);//4,this指向obj2
</script>
5、原型链中的this--原型对象及构造函数中的this指向新创建的实例对象。使用prototype扩展方法可以使用this获取到源对象的实例，私有字段无法通过原型链获取。
//代码清单5
<scripttype="text/javascript">
functionFunc(){
this.fieldA="I'mafield";
varprivateFieldA="I'mavar";
}
Func.prototype={
ExtendMethod:function(str){
alert(str+":"+this.fieldA);
alert(privateFieldA);//出错,私有字段无法通过原型链获取。
}
};
varobj=newFunc();
obj.ExtendMethod("Fromprototype");//此时构造函数及原型链中的this指向对象obj
</script>
6、闭包中的this--闭包：写在function中的function，this指向全局对象window。
6.1对象中的闭包
//代码清单6
<scripttype="text/javascript">
varname="Thewindow";
varobj={
name:"MyObject",
getNameFunc:function(){
returnfunction(){
returnthis.name;
}
}
};
alert(obj.getNameFunc()());//Thewindow
</script>
此时，闭包中的this指向全局对象window，只能取到全局对象的属性。那么对象内部的属性（外部函数的变量）要想访问又怎么办呢？把外部函数的this对象保存在一个闭包能访问的变量就可以了。看如下代码：
//代码清单7
<scripttype="text/javascript">
varname="Thewindow";
varobj={
name:"MyObject",
getNameFunc:function(){
varthat=this;
returnfunction(){
returnthat.name;
}
}
};
alert(obj.getNameFunc()());//Myobject
</script>
将外部函数的this赋值给that变量，就能读取到外部函数的变量。
6.2不管是直接引用function，还是实例化一个function，其返回的闭包函数里的this都是指向window。
//代码清单8
<scripttype="text/javascript">
functiona(){
alert(this==window);
varthat=this;
varfunc=function(){
alert(this==window);
alert(that);
};
returnfunc;
}
varb=a();
b();//true,true,[objectWindow]
varc=newa();
c();//false,true,[objectobject]
</script>
7、函数使用bind()方法绑定一个对象，this会指向传给bind()函数的值。
//代码清单9
<scripttype="text/javascript">
window.color="red";
varobj={color:"blue"};
functionsayColor(){
alert(this.color);
}
varobjSayColor=sayColor.bind(obj);
objSayColor();//blue
</script>
8、内嵌在HTML元素中的脚本段，this指向元素本身
//代码清单10
<divonclick="test(this)"id="div">ClickMe</div>
<scripttype="text/javascript">
functiontest(obj){
alert(obj);//[objectHTMLDivElement]
}
</script>
9、写在script标签中：this就是指全局对象window。这个跟第一点的全局函数调用的全局变量一样。
以上所述是小编给大家介绍的JavaScript中的this引用，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持！