javascript this機制的四種使用規則

2021-08-02 11:47:42 字數 1485 閱讀 9494

this永遠指向呼叫者。

this到底繫結或者引用的是哪個物件環境決定於函式被呼叫的地方。而函式的呼叫有不同的方式，在不同的方式中呼叫決定this引用的是哪個物件是由四種規則確定的。我們乙個個來看。

1. 預設繫結全域性變數

這條規則是最常見的，也是預設的。當函式被單獨定義和呼叫的時候，應用的規則就是繫結全域性變數。如下：

function fn() 


var a = 2;


fn(); // 2 -- fn單獨呼叫，this引用window
2. 隱式繫結

隱式呼叫的意思是，函式呼叫時擁有乙個上下文物件，就好像這個函式是屬於該物件的一樣。例如：

function fn() 


var obj = ;


obj.fn(); // 2 -- this引用obj。
需要說明的一點是，最後乙個呼叫該函式的物件是傳到函式的上下文物件。如：

function


fn() 


var obj2 = ;


var obj1 = ;


obj1.obj2.fn(); // 42 -- this引用的是obj2.
還有一點要說明的是，失去隱式繫結的情況，如下：

function


fn() 


var obj = ;


var bar = obj.fn; // 函式引用傳遞


var a = "全域性"; // 定義全域性變數


bar(); // "全域性"
如上，第8行雖然有隱式繫結，但是它執行的效果明顯是把fn賦給bar。這樣bar執行的時候，依然是預設繫結全域性變數，所以輸出結果如上。

3. 顯示繫結

function fn() 


var obj = ;


fn.call( obj ); // 2
如果我們傳遞第乙個值為簡單值，那麼後台會自動轉換為對應的封裝物件。如果傳遞為null，那麼結果就是在繫結預設全域性變數，如：

function


fn() 


var obj = ;


var a = 10;


fn.call( null); // 10
4. new新物件繫結

如果是乙個建構函式，那麼用new來呼叫，那麼繫結的將是新建立的物件。如：

function


fn(a) 


var bar = new fn( 2 );


console.log( bar.a );// 2
注意，一般建構函式名首字母大寫，這裡沒有大寫的原因是想提醒讀者，建構函式也是一般的函式而已。

JavaScript this個人理解

一.呼叫公共函式，this預設指向的為window 直接上幾個 1.var a 10 function test test 結果10 2.var a 10 function test function test1 test 結果 10 10 3.var a 10 function test test...

javascript this指標的陷阱

function backimg jqobj this.slideup function 像上面這樣的一段js backimg是乙個類。init是這個類的初始化函式，本意是呼叫初始化函式init時，註冊乙個雙擊事件，雙擊事件的執行函式是slideup。實際執行中發現slideup無法正確執行。經過f...

JavaScript this指向 學習

函式預編譯過程 this window 全域性作用域裡 this window obj.func func 裡的this指向obj 誰呼叫 this就指向誰 var name 222 var a var fun a.say fun 在全域性執行 沒人呼叫 this指向 window a.say 在a...