看懂js中this關鍵字的指向問題

Little heaven發表於2018-12-21
JS

this總是指向函式的直接呼叫者（而非間接呼叫者）；如果有new關鍵字，this指向new出來的那個物件；在事件中，this指向觸發這個事件的物件，特殊的是，IE中的attachEvent中的this總是指向全域性物件Window； 通俗的講，因為ｔｈｉｓ只存在於函式中，而函式是需要被呼叫的，然後ｔｈｉｓ是誰（物件）呼叫函式就指向誰（物件）。下面我們看看不同情況下的ｔｈｉｓ指向情況。

１）單純的函式呼叫

<script>
function test(){ 
    this.x = 1; 
    alert(this.x)／／結果為：１
 };
test();／／這裡window呼叫了test函式， window.x即this.x
alert(this.x) ;／／結果為：１
alert('x' in window);／／結果為：true
</script>
``

２）函式作為物件的方法呼叫
複製程式碼

var test = { a:1, b:function(){ alert(this.a); } }; test.b();／／結果為：1 test呼叫了函式b，this指向test alert(this.a);//結果為：undefined  window呼叫了alert函式，this指向 window而window裡並沒有a這個屬性。

注：在非嚴格模式下，this沒有正確指向，則指向window物件，在嚴格模式下，沒有正確指向，為 undefined。預設就是非嚴格模式。

3)作為建構函式呼叫
複製程式碼
這裡this指向的是構造的新物件，也就是 test2，所以test2也有了屬性a並等於1。

4)apply()、call() 呼叫

複製程式碼

這裡的三次呼叫，this分別指向test1、test2和window。第一種前面已經提到了，第二種是通過call或者apply方法使fun中原本指向test1的this變成了指向test2（即call、apply方法的第一個引數）。第三種情況屬於第一個引數為空（好像為undefined時也會指向window）時，會預設指向window，..call() =》 ..call(window)。

複製程式碼

相關文章