什麼時候應該在 JavaScript 繼承中避免 `Child.prototype = Parent.Prototype`？

何時在JavaScript 繼承中避免Child.prototype = Parent.Prototype

雖然在JavaScript 中使用Child.prototype = 繼承是常見的做法new Parent();，在某些情況下Child.prototype = Parent.Prototype 可能會導致意外行為。

考慮以下程式碼片段：

function GameObject(oImg, x, y) {

    this.x = x;
    this.y = y;
    this.img = oImg;

    this.hit = new Object();
    this.hitBox.x = x;
    this.hitBox.y = y;
    this.hitBox.width = oImg.width;
    this.hitBox.height = oImg.height;

}

Spaceship.prototype = new GameObject();
Spaceship.prototype.constructor = Spaceship;

function Spaceship(){
    console.log("instantiate ship");
    GameObject.apply(this, arguments);
    this.vx = 0;
    this.vy = 0;
    this.speed = 3;
    this.friction = 0.94;
}

在檢查 Spaceship 建構子時，您會發現你會注意到它的 __proto__ 屬性指向 Spaceship，而不是 GameObject。這是因為以下行：

this.hitBox.width = oImg.width;
this.hitBox.height = oImg.height;

直接將屬性指派給 this.hitBox，而 GameObject 原型中不存在該屬性。這種行為是有問題的，因為它：

• 破壞繼承：當使用 Child.prototype = Parent.Prototype 時，Child 原型不會繼承添加到 Parent 原型的任何新函數。
• 違反了instanceof檢查：由於Spaceship實例的__proto__指向Spaceship而不是GameObject，檢查if(object instanceof GameObject)將會失敗。

為什麼使用Child.prototype = new Parent() ;相反

Child.prototype = new Parent();其新建立的實例分配給Child 原型。這可以確保：

• 保留繼承：任何新增到父級原型的函數都會自動由子級繼承。
• instanceof 檢查是準確的：子級實例的 __proto__指向Parent原型，允許正確的instanceof檢查。

替代解決方案

在支援Object.create的現代瀏覽器中，您可以使用Spaceship.prototype = Object.create(GameObject.prototype) ;創建子原型。這在功能上等同於 Child.prototype = new Parent();但更簡潔，避免了不必要的建構函式呼叫。

以上是什麼時候應該在 JavaScript 繼承中避免 `Child.prototype = Parent.Prototype`？的詳細內容。更多資訊請關注PHP中文網其他相關文章！