JavaScript this指向解綁簡單介紹

關於改變this的指向方式有多種，比如可以使用call()或者bind()函式等。

不過這裡就不多介紹了，具體可以參閱以下章節。

1.call()函式可以參閱js call()一章節。

2.原生的bind()函式可以參閱javascript bind()一章節。

3.this的基本用法可以參閱javascript this一章節。

下面介紹一下一下js中常見的一種解綁this的方式，先看一段程式碼例項:

[JavaScript] 純文字檢視 複製程式碼
var url="softwhy.com";
var obj={
  url:"螞蟻部落",
  func:function(){
    return this.url;
  }
};
console.log(obj.func());

上面的程式碼可以輸出字串"螞蟻部落"，這個沒有什麼疑問，再來看一段程式碼:

[JavaScript] 純文字檢視 複製程式碼
var url="softwhy.com";
var obj={
  url:"螞蟻部落",
  func:function(){
    return this.url;
  }
};
console.log((0||obj.func)());

上面的程式碼的輸出結果是"螞蟻部落"，說明this的指向已經不是物件obj，而是指向window物件，下面就對此現象的原因做一下簡單介紹，希望能夠給需要的朋友帶來一定的幫助。

在ES3規範中，除去call()和apply()函式，還能夠影響this的就是Property accessor（屬性訪問）語法。

例如obj.func()，屬性訪問部分就是函式呼叫運算子"()"的左邊部分，它會獲取一個base為obj的referenceType（引用型別），然後進行函式呼叫運算. 則referenceType.base會為該函式執行環境的this提供引用。如果想要解除此引用物件，只要使用如下類似的方式即可，程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
var url="softwhy.com";
var obj={
  url:"螞蟻部落",
  func:function(){
    return this.url;
  }
};
console.log((0||obj.func)());

從上面程式碼的運算結果可以看出this是指向window物件的，也就是說明this已經從obj解綁了。

這是因為使用或運算子以後，會執行為真的那個表示式，並返回表示式的值，等效於如下程式碼:

[JavaScript] 純文字檢視 複製程式碼
var url="softwhy.com";
var obj={
  url:"螞蟻部落",
  func:function(){
    return this.url;
  }
};
//console.log((0||obj.func)());
var func=obj.func;
console.log(func());

在嚴格模式下會有所不同，具體可以參閱嚴格模式下this的指向問題一章節。