你必須知道的Javascript知識點之”this指標”的應用

很多人都知道this指標，這篇文章的主要目的是為了培訓我們公司的新人。
預設的this指標指向
規則1
this指標預設指向方法調用時為其指定的對象，如：obj.fun()，fun方法體中的this指標指向obj。

複製代碼 代碼如下:var user = { name: '段光偉' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光偉'

複製代碼 代碼如下:var user = { name: '段光偉' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光偉'

window.name = '李妞妞';
window.getName = user.getName
window.getName(); //返回‘李妞妞'
getName(); //返回‘李妞妞'

規則2
如果在方法調用時沒有為方法指定對象則this指標預設指向window，如：fun()，fun方法體中的this指標指向window。複製代碼 代碼如下:var fun = function(){
return this;
}
fun(); //返回window對象

規則3沒有在方法體中的代碼可以看作執行在一個匿名方法，根據規則2可以推論出其this指標指向window。

this //window對象
改變this指標的預設指向
使用apply

複製代碼 代碼如下:var user = { name: '段光偉' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //輸出‘段光偉:你好'
user.hi.apply(window, ['你好']); //輸出‘李妞妞:你好'

使用call複製代碼 代碼如下:var user = { name: '段光偉' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //輸出‘段光偉:你好'
user.hi.call(window, '你好'); //輸出‘李妞妞:你好'

建構函式中的this指向
建構函式中的this指標預設指向執行正在構造的對象。複製代碼 代碼如下:var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光偉');
user.hi(); //輸出‘段光偉'

最後的小測試
猜猜最後的輸出時什嗎？複製代碼 代碼如下:var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光偉');
user.hi(); //輸出‘段光偉'

var hi = user.hi;

hi(); //猜猜這裡的輸出