通過傳遞構造函數參數來繼承屬性

Question

在以下代碼行中，改編自Mozilla JavaScript 教程的解決方案，Ball 類繼承了 Shape 類的 x、y 屬性。

Mozilla 頁面似乎暗示要從 Shape 繼承 x, y，它們必須在 Ball 構造函數的參數列表中定義（並在 Shape.call 函數調用中使用）。 但為什么這是必要的？ 原始的 Shape 構造函數不接受任何這些參數。

假設 random 是一個在別處定義的函數。

var width = canvas.width = window.innerWidth;
var height = canvas.height = window.innerHeight;

function Shape() {
  this.x = random(0,width);
  this.y = random(0,height);
}

function Ball(x, y) {
  Shape.call(this, x, y);
  this.size = random(10,20);
}

Ball.prototype = Object.create(Shape.prototype);
Ball.prototype.constructor = Ball;

這是他們在上一個示例中所做的注釋：

“在這種情況下，我們在創建新對象實例時指定繼承的屬性，但請注意，即使實例不需要將它們指定為參數，您也需要在構造函數中將它們指定為參數（也許您例如，在創建對象時，有一個屬性設置為隨機值。）”

Answer 1

我是最初編寫這些文檔的人。 我必須首先為造成的混亂深表歉意-那天我的大腦出去吃午飯了；-/

我已更新代碼和示例以解決問題，如此 GitHub 問題中所述：

https://github.com/mdn/learning-area/issues/7

如果您發現 MDN 內容有更多問題，請告訴我。

謝謝。

Answer 2

如果 Shape() 函數在 x,y 上運行並在 x,y 上做一些驗證/操作，那么傳遞 x,y 是有意義的。 原因是您不想在 Ball() 中重做這項工作。

但是由於簡單的賦值並不能保證傳遞 x,y，因為 x,y 無論如何都會附加到this對象上。

this.x = random(0,width);
this.y = random(0,height);

因此，看起來不需要傳遞 x,y。