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

在以下代碼行中，根據Mozilla JavaScript tutorial的解決方案進行了改編，Ball類從Shape類繼承x，y屬性。通過傳遞構造函數參數繼承屬性

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

假設隨機是其他地方定義的函數。

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;

這是他們前面的例子上做了說明：

「在這種情況下，我們指定，當我們創建一個新的對象實例繼承屬性，但請注意，你需要將其指定爲即使實例不要求將它們指定爲參數（例如，在創建對象時您可能已經設置了一個隨機值）。「

來源

2017-05-04 traincj

這似乎是教程代碼中的一個缺陷。除''this'之外''Shape.call'的附加參數被忽略。此外，從「Shape」構造函數中訪問全局變量「width」和「height」會感覺像抽象的抽象。 –

謝謝！我也這麼想。我想知道爲什麼教程說他們需要在'Ball'構造函數中被指定爲參數。 – traincj

我懷疑'Shape'構造函數應該把'x'和'y'作爲參數，而不是隨機初始化它們。那麼這是有道理的。 –

我是最初編寫這些文檔的人。我必須給的混亂一個大的道歉開始引起的 - 我的腦子是出去吃午飯的那一天; -/

我已經更新了代碼和實例來解決問題，因爲記錄在這個GitHub的問題：

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

如果您發現MDN內容有任何問題，請讓我知道。

謝謝。

來源

2017-05-04 19:58:41

如果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。

來源

2017-05-04 14:36:19

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

回答

相關問題