2017-05-04 9 views
1

Mozilla JavaScript tutorialのソリューションから適応された次のコード行では、BallクラスはShapeクラスのx、yプロパティを継承します。コンストラクタパラメータを渡すことによるプロパティの継承

Mozilla pageは、x、yをShapeから継承することを意味しているように見えますが、それらは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; 

これは、彼らが前の例に作られたノートがありますたとえインスタンスがパラメータとして指定されていなくてもコンストラクタ内のパラメータ(例えば、オブジェクトが作成されたときにランダムな値に設定されるプロパティを持っているかもしれません) "

+3

これはチュートリアルコードの欠陥のようです。 'this'から離れた' Shape.call'への追加の引数は単に無視されます。また、 'Shape'コンストラクタ関数内からグローバルの' width'と 'height'にアクセスすると、抽象度が悪くなります。 –

+0

ありがとう!私もそう思っていました。私は、なぜチュートリアルで「Ball」コンストラクタのパラメータとして指定する必要があるのか​​と不思議です。 – traincj

+1

'Shape'コンストラクタ関数は、ランダムに初期化するのではなく、引数として' x'と 'y'を取っていたと考えられます。その後、それは意味をなさないでしょう。 –

答えて

1

私は元々これらのドキュメントを書いた人です。私は混乱のための大きな謝罪を与えることから始めなければなりません原因 - 私の脳は、昼食に出て、その日だった; -/

このGitHubの問題に記載されているように私は、問題を修正するためのコードと例を更新しました:

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

MDNのコンテンツに問題が発生した場合は、教えてください。

ありがとうございました。

0

If 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を渡す必要はありません。

関連する問題