This對象在js中就一直是個坑貨酌毡,很難判斷它到底指向什么唾那,而我們由于來自C++或者python的self的經(jīng)驗刘离,又常常會犯這一類的錯誤歇式。接下來就詳細地講一下this對象的歸屬。
rule1:全局環(huán)境的this
javascript的環(huán)境天生就由函數(shù)來決定牙捉,在js里不能通過代碼塊隔開上下文,不被函數(shù)所包裹的環(huán)境就是全局環(huán)境敬飒,全局環(huán)境中的this就指向全局變量window邪铲,看下面一個例子
var name='jjj';
console.log(this.name);
//會成功輸出jjj
rule2:作為方法調(diào)用時的this
顯然這種情況很好判斷,與python里的self是一致的无拗,this毫無疑問指向調(diào)用方法的對象
var user={
name:'kkk'
};
user.getName=function(){
console.log(this.name);
};
user.getName();
//會輸出kkk
rule3:作為構(gòu)造函數(shù)時的this
這時的this也不用我多說带到,顯然是指向新創(chuàng)建的對象,構(gòu)造函數(shù)的運行其實并不創(chuàng)建對象英染,而僅僅是初始化揽惹,對象在運行之前就已經(jīng)被創(chuàng)建
下面還是舉例說明
function User(name){
this.name=name;
}
var f1=new User('kkk');
var f2=User('kkk');
console.log(f1.name);//kkk
console.log(f2.name);//undefined沒有name屬性
rule4:間接調(diào)用中的this
所謂間接調(diào)用是指利用apply和call來調(diào)用函數(shù),這時的this指向它們參數(shù)列表中的第一個參數(shù)四康。
var setName=function(name){
this.name=name;
};
var user={level:2};
user.apply(setName,'jjj');
console.log(user.name);//jjj
rule5:其他情況中的this
記住其他情況下this均不會被改變搪搏,這里也是最容易犯錯的地方。
var name = "clever coder";
var person = {
name : "foocoder",
hello : function(sth){
var sayhello = function(sth) {
console.log(this.name + " says " + sth);
};
sayhello(sth);
}
}
person.hello("hello world");//clever coder says hello world
上面的代碼看起來很奇怪闪金,難道this不應(yīng)該指向person嗎疯溺?
我們應(yīng)該記住被嵌套的函數(shù)中的this是不會指向嵌套它的函數(shù),在這個例子里面就是sayhello中的this不會指向hello對應(yīng)的那個函數(shù)哎垦。如果我們把例子稍稍改一下變成
hello:function(sth){
console.log(this.name + " says " + sth);
}
//foocoder says hello world
大家應(yīng)該已經(jīng)看明白了囱嫩,這個時候,sayhello并非在作為方法調(diào)用漏设,所以this指向全局對象墨闲。。郑口。
這時候問題來了鸳碧,用node運行最初的例子會顯示undefined says hello world,不知道有沒有大神講解一下犬性。
rule6:eval破壞所有規(guī)則
最后以一個例子結(jié)束
var name = "clever coder";
var user={
name:'kkk'
};
user.getName=function(){
console.log(this.name);
};
var get=user.getName;
get();//clever coder
大家是否明白了杆兵?