this是javascript的一個關鍵字,隨著函數使用場合不同,this的值會發生變化。但是總有一個原則,那就是this指的是調用函數的那個對象。
this指針在傳統OO語言中,是在類中聲明的,表示對象本身.在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和對象:
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:
var showValue = function(){
alert(this.value);
};
1.<input id="test" type="text" />
通過dom.onclick綁定事件,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對象的
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
this和call
//定義一個人,名字為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 中的引用始終指向最終的對象,而並非引用本身
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 並非指向它.
引用指向的只能是具體的對象,當具體對象改變的時候,引用還是引用原來的對象,而不是改變後的對象。
以上所述是小編給大家介紹的JavaScript中的this指針和引用知識,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對網站的支持!