在學習javascript中我們往往會被this的指向問題弄的頭昏轉向，今天我們就來學習一下this的指向問題，和改變this指向的方法。

一.this的指向問題

在學習this的指向問題之前我們需要明白兩點：

1：this永遠指向一個對象；

2：this的指向完全取決于函數調用的位置；

針對上面第一點我們能很好理解，因為在javascript中一切都是對象。第二點其實也是好理解，當函數調用的位置不同是，this的指向的對象就不同，所以可以說this的指向可以動態變換的，下面我們先通過一個簡單的例子來看一下this的指向是變換的

<script>function fun(){ console.log(this.name); } var change={ name:’hello’, f:fun } var name =’world’ var result=change.f()//hello fun();//world</script>

通過上述例子我們可以很清楚的看到this的指向的變化，因為有一個函數在對象change里面，所以this就是指向的函數外部的對象，所以輸出了hello。

想必看完上述例子后大家對this的動態指向切換有了一定的了解。

那么接下來，我們對this使用最頻繁的幾種情況做一個總結，最常見的基本就是以下3種：

對象中的方法，事件綁定 ，構造函數 ，定時器

前兩個就不必多說了，我們看一下定時器中的this指向問題，

var obj = { fun:function(){ this ; }}​setInterval(obj.fun,1000); // this指向window對象setInterval(’obj.fun()’,1000); // this指向obj對象

setInterval() 是window對象下內置的一個方法，接受兩個參數，第一個參數允許是一個函數或者是一段可執行的 JS 代碼，第二個參數則是執行前面函數或者代碼的時間間隔；

在上面的代碼中，setInterval(obj.fun,1000) 的第一個參數是obj對象的fun ，因為 JS 中函數可以被當做值來做引用傳遞，實際就是將這個函數的地址當做參數傳遞給了 setInterval 方法，換句話說就是 setInterval 的第一參數接受了一個函數，那么此時1000毫秒后，函數的運行就已經是在window對象下了，也就是函數的調用者已經變成了window對象，所以其中的this則指向的全局window對象；

而在 setInterval(’obj.fun()’,1000) 中的第一個參數，實際則是傳入的一段可執行的 JS 代碼；1000毫秒后當 JS 引擎來執行這段代碼時，則是通過 obj 對象來找到 fun 函數并調用執行，那么函數的運行環境依然在 對象 obj 內，所以函數內部的this也就指向了 obj 對象；

除了這些我們還需要理解三個可以改變this指向的函數，包括箭頭函數，call（），apply（）

箭頭函數：官方有解釋，箭頭函數引入的其中一個原因，就是其不綁定this；在箭頭函數中，箭頭函數的this被設置為封閉的詞法環境的，換句話說，箭頭函數中的this取決于該函數被創建時的環境。

var globalObject = this;var foo = (() => this);console.log(foo() === globalObject); // true// 接著上面的代碼// 作為對象的一個方法調用var obj = {foo: foo};console.log(obj.foo() === globalObject); // true// 嘗試使用call來設定thisconsole.log(foo.call(obj) === globalObject); // true// 嘗試使用bind來設定thisfoo = foo.bind(obj);console.log(foo() === globalObject); // true

無論如何，foo 的 this 被設置為他被創建時的環境（在上面的例子中，就是全局對象）。這同樣適用于在其他函數內創建的箭頭函數：這些箭頭函數的this被設置為封閉的詞法環境的。

// 創建一個含有bar方法的obj對象，// bar返回一個函數，// 這個函數返回this，// 這個返回的函數是以箭頭函數創建的，// 所以它的this被永久綁定到了它外層函數的this。// bar的值可以在調用中設置，這反過來又設置了返回函數的值。var obj = { bar: function() { var x = (() => this); return x; }};// 作為obj對象的一個方法來調用bar，把它的this綁定到obj。// 將返回的函數的引用賦值給fn。var fn = obj.bar();// 直接調用fn而不設置this，// 通常(即不使用箭頭函數的情況)默認為全局對象// 若在嚴格模式則為undefinedconsole.log(fn() === obj); // true// 但是注意，如果你只是引用obj的方法，// 而沒有調用它var fn2 = obj.bar;// 那么調用箭頭函數后，this指向window，因為它從 bar 繼承了this。console.log(fn2()() == window); // true

call和apply方法：將一個對象作為call或者apply的第一個參數，this將會被綁定到這個參數對象上

var obj = {parent:’男’};var parent = ’28’;function child(obj){ console.log(this.parent);}child(); // 28 child.call(obj); //男child.apply(obj); //男

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持好吧啦網。