首頁 >web前端 >js教程 >JavaScript 繼承中 proto 和 constructor.prototype 有什麼不同?

JavaScript 繼承中 proto 和 constructor.prototype 有什麼不同?

Barbara Streisand
Barbara Streisand原創
2024-10-21 14:57:30420瀏覽

What's the Difference Between proto and constructor.prototype in JavaScript Inheritance?

理解proto 和constructor.prototype

理解__proto__ 屬性和constructor.prototype 之間的區別很重要使用JavaScript 物件時的constructor.prototype。

proto 和原型鏈

每個 JavaScript 物件都有一個引用原型物件的內部 __proto__ 屬性它的建構子。此原型物件包含該類型物件的共享屬性和方法。

示範

考慮以下程式碼:

<code class="js">function Gadget(name, color) {
  this.name = name;
  this.color = color;
}

Gadget.prototype.rating = 3;

var newtoy = new Gadget("webcam", "black");</code>

在此例如,newtoy 的__proto__ 將指向Gadget.prototype,其rating 屬性值為3。因此,存取 newtoy.__proto__.__proto__.__proto__ 將傳回 null,因為它沒有進一步的原型物件。

constructor.prototype.constructor.prototype

這個複雜的表達式並不會直接存取原型鏈。相反,它會嘗試存取 Gadget 建構函數的 constructor.prototype 的 constructor.prototype 的 constructor.prototype 。在本例中,它是 Gadget 建構子本身。因此,它一直指向 Gadget.prototype。

在 Internet Explorer 中檢查 Null

Internet Explorer 不支援 __proto__ 屬性。要在這種情況下檢查 null,可以使用 hasOwnProperty() 方法來確定 __proto__ 是否存在。例如:

<code class="js">if (!(newtoy.hasOwnProperty("__proto__"))) {
  // `__proto__` is not supported
}</code>

視覺表示

為了幫助理解,這裡有一個原型鏈的視覺圖以及__proto__ 和constructor.prototype 之間的關係:

[原型鍊和__proto__/constructor.prototype 關係的圖像]

這張簡化的圖全面概述了JavaScript 物件的內部工作原理,有助於闡明這些屬性及其角色之間的區別在原型鏈中。

以上是JavaScript 繼承中 proto 和 constructor.prototype 有什麼不同?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn