this關鍵字的理解與總結

2022-06-15 11:06:17 字數 4014 閱讀 1318

1.this關鍵字的含義

簡單說,this就是屬性或方法「當前」所在的物件。

this都有乙個共同點:它總是返回乙個物件。

舉例:

var a =

};a.describe();

//'姓名:張三'

由於物件的屬性可以賦給另乙個物件,所以屬性所在的當前物件是可變的,即this的指向是可變的。

var a =

};var b =;

b.describe =a.describe;

b.describe()

//"姓名:李四"

重構如下

function

f()

var a =;

var b =;

a.describe()

//"姓名:張三"

b.describe() //

"姓名:李四"

只要函式被賦給另乙個變數,this的指向就會變。

var a =

};var name = '李四';

var f =a.describe;

f()

//"姓名:李四"

a.describe被賦值給變數f,內部的this就會指向f執行時所在的物件(本例是頂層物件);

一切皆物件,執行環境也是物件,所以函式都是在某個物件之中執行,this就是函式執行時所在的物件(環境)。

2.this的實質

var obj = ;

原始的物件以字典結構儲存;

引擎先從obj拿到記憶體位址,然後再從該位址讀出原始的物件,返回它的foo屬性。

}

屬性值是乙個函式的情況

var obj =  };

}

由於函式是乙個單獨的值,所以它可以在不同的環境(上下文)執行。

它的設計目的就是在函式體內部,指代函式當前的執行環境。

3.使用場合

(1)全域性環境

全域性環境使用this,它指的就是頂層物件window

this === window //

true

(2)建構函式

建構函式中的this,指的是例項物件。

var obj = function

(p) ;

var o = new obj('hello world!');

o.p

//"hello world!"

(3)物件的方法

如果物件的方法裡面包含thisthis的指向就是方法執行時所在的物件。該方法賦值給另乙個物件,就會改變this的指向。

如果this所在的方法不在物件的第一層,這時this只是指向當前一層的物件,而不會繼承更上面的層。

var a =

}};a.b.m()

//undefined

因此,實際執行是下面這個**

var b =

};var a =;

(a.b).m()

//等同於 b.m()

想要達到預期效果是

var a =,

p: 'hello'}

};

如果這時將巢狀物件內部的方法賦值給乙個變數,this依然會指向全域性物件。

var a =,

p: 'hello'}

};var hello =a.b.m;

hello()

//undefined

4. 1)避免多層this

var o =();

}}o.f1()

//object

//window

實際執行如下

var temp = function

() ;

var o =

}

乙個解決方法是在第二層改用乙個指向外層this的變數。

that,固定指向外層的this,然後在內層使用that,就不會發生this指向的改變。

var o =();

}}o.f1()

//object

//object

4. 2)避免陣列處理方法中的this

var o =);

}}o.f()

//undefined a1

//undefined a2

解決方法

1.使用中間變數固定this;

2.另一種方法是將this當作foreach方法的第二個引數,固定它的執行環境。

var o =, 

this

); }

}o.f()

//hello a1

//hello a2

3.避免在**函式中使用this;

var o = new

object();

o.f = function

() //

jquery 的寫法

$('#button').on('click', o.f);

上面**中,點選按鈕以後,控制台會顯示false。原因是此時this不再指向o物件,而是指向按鈕的 dom 物件,因為f方法是在按鈕物件的環境中被呼叫的。

為了解決這個問題,可以採用下面的一些方法對this進行繫結,也就是使得this固定指向某個物件,減少不確定性。

1.function.prototype.call()

call方法的引數,應該是乙個物件。如果引數為空、nullundefined,則預設傳入全域性物件。

3.function.prototype.bind()

var counter =

};var func =counter.inc.bind(counter);

func();

counter.count

//1

如果bind方法的第乙個引數是nullundefined,等於將this繫結到全域性物件,函式執行時this指向頂層物件(瀏覽器為window);

function

add(x, y)

var plus5 = add.bind(null, 5);

plus5(10) //

15

this關鍵字理解

public class test implements runnable synchronized void m1 throws interruptedexception synchronized void m2 throws interruptedexception override publi...

this關鍵字的理解

test type button value 按鈕 onclick test function test 使用標籤屬性註冊事件 此時this 指向的是 window 物件 使用 addeventlistener 等註冊。此時this 也是指向 input document.getelementbyi...

this關鍵字的理解

this理解為 當前物件 或 當前正在建立的物件 this代表所在類的當前物件的引用 位址值 即物件對自己的引用。備註 意思方法被那個物件呼叫,方法中的this就代表那個物件。即誰呼叫,this就是誰。this修飾的變數用於指代成員變數,其主要作用是 區分區域性變數和成員變數的重名問題 方法的形參如...