本文详细解析JavaScript中this指针在不同调用场景下的指向规则，包括全局对象、对象方法、嵌套函数、事件绑定及构造函数等情境。同时探讨JavaScript中引用的特性，说明引用始终指向最终对象而非中间变量，并通过代码示例阐明new、call及DOM事件对this的影响。
JavaScript this指针基础与全局指向
this是JavaScript的关键字，其值随函数使用场合的不同而变化。核心原则是：this指向调用该函数的对象。
在传统面向对象语言中，this在类中声明，代表对象本身；而在JavaScript中，this表示当前执行上下文，即调用者的引用。
核心规则：this永远指向函数对象的所有者。
全局环境下的this指向：
var a = 1;
function foo(){
var b = 2;
console.log(this.a+b);//3
}
foo();
//foo函数所有者是window,全局函数中this指代的是window对象(********除非使用new,call,apply方法来改变this的指代关系)对象方法与嵌套函数中的this
对象方法中的this指向：
var person = {
name:'Theo Wong',
gender:'male',
getName:function(){
console.log(this.name);//getName函数所有者是person对象
}
};
person.getName();嵌套函数中的this指向：
var myObject = {
func1:function() {
console.log(this); //myObject
var func2=function() {
console.log(this); //window
var func3=function() {
console.log(this); //window
}();
}();
}
};
myObject.func1();
//在嵌套函数中,由于嵌套函数的执行上下文是window,所以this指代的是window对象,其实这是ECMA-262-3的一个bug,在最新的ECMA-262-5中已经修复事件处理中的this指向差异
事件处理程序中的this指向：
var showValue = function(){
alert(this.value);
};1. HTML元素定义：<input id="test" type="text" />
通过DOM属性绑定事件：document.getElementById('test').onclick = showValue;
此时showValue作为dom对象的onclick方法被调用，因此this指向dom对象，而非window对象。
2. 在HTML标签内部定义：<input id="test" type="text" onclick="showValue();" />
点击DOM元素时，无法获取正确的this，此时this指向window对象。由于window对象未定义value属性，因此无法通过this.value获取值。
***此时并非将showValue函数直接赋值给dom对象的onclick属性，而是引用。此时function()函数的所有者是window。
document.getElementById('test').onclick = function(){
showValue();
}通过addEventListener或attachEvent绑定事件监听器：
<input type="text" id="test" />
<script type="text/javascript">
var dom = document.getElementById('test');
id = 'window';
function test(){
alert(this.id);
}
dom.addEventListener?dom.addEventListener('click',test,false):dom.attachEvent('onclick',test);
//addEventListener test
//attachEvent window
</script>
//这种绑定事件监听的方式,attachEvent this是window对象,而addEventListener则是dom对象的构造函数与call改变this指向
构造函数中的this指向：
function obj(name,age){
this.name = name;
this.age = age;
this.fun = function(){
alert(this.name);
};
}
var obj = new obj('xht',18);//this就指这个新对象,new 改变this的指代关系
obj.fun();//xht使用call方法改变this指向：
//定义一个人,名字为jack
var jack = {
name : "jack",
age : 26
}
//定义另一个人,名字为abruzzi
var abruzzi = {
name : "abruzzi",
age : 26
}
//定义一个全局的函数对象
function alertName(){
return this.name;
}
//设置alertName的上下文为jack, 此时的this为jack
alert(alertName.call(jack));
//设置alertName的上下文为abruzzi,此时的this为abruzzi
alert(alertName.call(abruzzi));JavaScript对象引用机制解析
引用机制是一个有趣的话题。与其他语言不同，JavaScript中的引用始终指向最终的对象，而非引用本身。
var obj = {}; // 空对象
var ref = obj; // 引用
obj.name = "objectA" ;
alert(ref . name); //ref 跟着添加了 name 属性
obj = ["one" , "two" , "three"]; //obj 指向了另一个对象 ( 数组对象 )
alert(ref.name); //ref 还指向原来的对象
alert(obj.length ); //3
alert(ref.length);obj只是对匿名对象的引用，因此ref并非指向obj本身。
引用只能指向具体对象。当具体对象改变时，引用仍指向原来的对象，而非改变后的对象。
以上介绍了JavaScript中this指针和引用的相关知识，希望对大家有所帮助。如有任何疑问，请留言，小编会及时回复。感谢大家对本站的支持！