這篇文章主要介紹JavaScript中this怎么用，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！
this是面向?qū)ο笳Z言中一個重要的關(guān)鍵字，理解并掌握該關(guān)鍵字的使用對于我們代碼的健壯性及優(yōu)美性至關(guān)重要。而javascript的this又有區(qū)別于Java、C#等純面向?qū)ο蟮恼Z言，這使得this更加撲朔迷離，讓人迷惑。
this使用到的情況：
1. 純函數(shù)
2. 對象方法調(diào)用
3. 使用new調(diào)用構(gòu)造函數(shù)
4. 內(nèi)部函數(shù)
5. 使用call / apply
6.事件綁定
1. 純函數(shù)
重慶分公司
重慶分公司
var name = 'this is window'; //定義window的name屬性
function getName(){
console.log(this); //控制臺輸出: Window //this指向的是全局對象--window對象
console.log(this.name); //控制臺輸出: this is window /
}
getName();運(yùn)行結(jié)果分析：純函數(shù)中的this均指向了全局對象，即window。
2. 對象方法調(diào)用
var name = 'this is window'; //定義window的name屬性,看this.name是否會調(diào)用到
var testObj = {
name:'this is testObj',
getName:function(){
console.log(this); //控制臺輸出:testObj //this指向的是testObj對象
console.log(this.name); //控制臺輸出: this is testObj
}
}
testObj.getName();運(yùn)行結(jié)果分析：被調(diào)用方法中this均指向了調(diào)用該方法的對象。
3. 使用new調(diào)用構(gòu)造函數(shù)
function getObj(){
console.log(this); //控制臺輸出: getObj{} //this指向的新創(chuàng)建的getObj對象
}
new getObj();運(yùn)行結(jié)果分析：new 構(gòu)造函數(shù)中的this指向新生成的對象。
4. 內(nèi)部函數(shù)
var name = "this is window"; //定義window的name屬性,看this.name是否會調(diào)用到
var testObj = {
name : "this is testObj",
getName:function(){
//var self = this; //臨時(shí)保存this對象
var handle = function(){
console.log(this); //控制臺輸出: Window //this指向的是全局對象--window對象
console.log(this.name); //控制臺輸出: this is window
//console.log(self); //這樣可以獲取到的this即指向testObj對象
}
handle();
}
}
testObj.getName();運(yùn)行結(jié)果分析：內(nèi)部函數(shù)中的this仍然指向的是全局對象，即window。這里普遍被認(rèn)為是JavaScript語言的設(shè)計(jì)錯誤，因?yàn)闆]有人想讓內(nèi)部函數(shù)中的this指向全局對象。一般的處理方式是將this作為變量保存下來，一般約定為that或者self，如上述代碼所示。
5. 使用call / apply
var name = 'this is window'; //定義window的name屬性,看this.name是否會調(diào)用到
var testObj1 = {
name : 'this is testObj1',
getName:function(){
console.log(this); //控制臺輸出: testObj2 //this指向的是testObj2對象
console.log(this.name); //控制臺輸出: this is testObj2
}
}
var testObj2 = {
name: 'this is testObj2'
}
testObj1.getName.apply(testObj2);
testObj1.getName.call(testObj2);Note：apply和call類似，只是兩者的第2個參數(shù)不同：
[1] call( thisArg [，arg1，arg2，… ] ); // 第2個參數(shù)使用參數(shù)列表：arg1，arg2，...
[2] apply(thisArg [，argArray] ); //第2個參數(shù)使用 參數(shù)數(shù)組：argArray
運(yùn)行結(jié)果分析：使用call / apply 的函數(shù)里面的this指向綁定的對象。
6. 事件綁定
事件方法中的this應(yīng)該是最容易讓人產(chǎn)生疑惑的地方，大部分的出錯都源于此。
