關於js建構函式中this的指向問題

2021-08-14 18:49:56 字數 2254 閱讀 3167

js裡沒有類.

建構函式是個函式,this指向的是個物件,this蒙上眼睛指也指不到建構函式去.

建構函式的this指向建立的例項物件無疑. 要明白這一點,要先弄明白,用new操作符呼叫建構函式的時候都發生了什麼.

正好我有個答案是講建構函式的, 我這裡原樣搬來:

造函式其實和普通函式本質上並無區別,唯一的區別有兩個:

函式首字母大寫,這個區別只是約定俗成的,便於區分。你實在要小寫定義建構函式也完全沒問題,所以這個區別可以忽略。

建構函式的呼叫需要用new操作符,而普通函式的呼叫又分很多種,但是都不會用到new操作符。所以,建構函式和普通函式的區別就在這個new操作符裡,現在讓我們來好好研究一下這個new操作符。

用new操作符建立物件時發生的事情:

**第一步: 建立乙個object物件例項。

第二步: 將建構函式的執行物件賦給新生成的這個例項。

第三步: 執行建構函式中的**

第四步: 返回新生成的物件例項**

注意:原本的建構函式是window物件的方法,如果不用new操作符而直接呼叫,那麼建構函式的執行物件就 是window,即this指向了window。現在用new操作符後,this就指向了新生成的物件。理解這一步至關重要。

執行建構函式中的**,看**:

function

person()

var p = new person();

alert(p.name)//tiny colder;

alert(p.age)//undefined;

alert(window.age)//22;

當用new操作符建立物件時,先建立了乙個物件例項,然後執行**。所以還在糾結,什麼時候建構函式定義的屬性會繼承給例項物件的,都可以這麼來看:

var p = new

object();

p.name = "tiny colder";

這是普通的建立物件,然後給物件新增屬性的方法。如果每建立乙個物件,都需要這麼幾行**,無疑是糟糕的。這個需求就正好跟這一點對應:new操作符,自動執行建構函式裡的**。如此我們便可以省掉新增屬性時重複冗餘的**。那麼這些屬性時如何新增到新生成的物件裡的呢?

第二個步驟裡已經說了:將建構函式的執行物件賦給新生成的這個例項。再結合上一段裡說的,自動執行建構函式裡的this.name = "tiny colder";時,就相當於是執行p.name = "tiny colder";而建構函式裡的

var age = 22;語句,會執行但是對新生成的物件並無影響。window.age = 22;語句,會執行,且會給window物件新增乙個屬性。alert為證。

或許到這裡,你已經理解了new操作符的前三步了,重要的三步。但是這個函式是如何返回物件的呢?我們並沒有看到有任何跟return相關的語句。這就是new操作符的最後一步:返回新生成的物件。

如果被呼叫的函式沒有顯式的 return 表示式(僅限於返回物件),則隱式的會返回 this 物件 - 也就是新建立的物件。

現在來看一下這個**:

function

person();

}var p = new person();

alert(p.name)//undefined;

乙個物件就這麼被建立出來了。

實際上,

var p = new

person();

和var p = new

object();

是一樣的效果。

簡單的總結:

顯式的返回以下值:undefined, null, boolean, number等基礎型別,並不會代替 new 式呼叫的預設行為。

但顯式返回以下值:{},,regexp, date, function,均會代替 new 呼叫的預設返回值 this.

大家都看到了,後者,全都是 物件,是複雜型別。

如果函式體是嚴格模式,則不會繫結 this 至全域性物件,如:

1

2

vara =function();

a();// 直接報錯

因為嚴格模式下,預設的 this 指向 undefined

js中的建構函式

宣告建構函式 function demo args 建構函式中的this表示新建立的物件,建構函式自動返回this 建構函式的原型物件,能夠被所有例項繼承 demo.prototype.fn function let demo new demo demo.fn aabb console.log de...

JS中的建構函式

創造物件的函式就是建構函式 使用 new 運算子,呼叫建構函式,可以例項化物件 1.我們見過的建構函式 date object array string number regexp new date new object var date new date 建構函式,構造物件,js規定,乙個函式可以...

關於JS建構函式的使用講解

js一般是採用自定義建構函式建立物件,那麼關於建構函式建立的例項屬性,方法和靜態屬性,方法。例項屬性和方法 都是繫結在使用建構函式建立出來的物件p上 最終使用的時候也是使用物件p來進行訪問,也就是全部依賴於建立的物件傳入引數等等決定 呼叫者始終是物件才有作用 靜態屬性和方法 繫結在函式身上的屬性和方...