問題タブ [prototypal-inheritance]

Studentから継承するPerson次の例を考えてみましょう。

ご覧のとおり、Studentオブジェクトのインスタンス化とそのメソッドの呼び出しは問題なく機能しますが、 がStudent.prototype.constructor返さPerson(name)れます。これは私には間違っているようです。

私が追加した場合：

期待どおり、をStudent.prototype.constructor返しますStudent(name, id)。

常に追加する必要がありStudent.prototype.constructor = Studentますか?

必要な場合の例を教えてください。

Javascriptでオブジェクトを継承する次の2つの方法に違いはありますか？

方法1：

方法2：

プロトタイプの継承を使用する方法を理解しようとしています。これが私が以下に持っているコードです。これは、Stoyan Stefanovによる「オブジェクト指向Javascript」という本に基づいていますが、いくつかの変更が加えられています。

基本的に私はAthleteオブジェクトを拡張するオブジェクトを持っていPersonます。3つのオブジェクトを作成しました。ボブは、PersonビリージーンとスティーブはAthletesです。ボブ、ビリージーン、スティーブをその特定の順序で追加しました。ボブ、ビリージーン、スティーブの3つのオブジェクトすべてで、オブジェクトに対して、関数say()とrun()関数を呼び出しました。getSpeed()jump()Athlete

以下のコードがあります。

ただし、コードを実行すると、最初にBilly Jeanの関数を呼び出しますが、Steveのプロパティが2回ポップアップします。つまり、SteveがBillyJeanを置き換えました。以下に示す出力。

ビリー・ジーンとスティーブを分離して、スティーブの詳細ではなく両方の詳細を2回取得する方法があるかどうか、疑問に思っていました。

それが不可能な場合、この問題を解決するために代わりにどのような代替手段を使用できますか？どんな解決策や助けも大きな助けになるでしょう。

ユーザーが最初の選択を行うメイン メニューから始まる、かなり複雑な Web アプリを構築しています。JavaScript で継承を使用して真の OOP アプローチを試したのはこれが初めてで、「this」キーワードが期待するものを参照していないという最初の問題に遭遇しました。これは、OOP/継承アプローチのより広範な問題の結果であると推測しているため、この個々の問題を解決する方法を教えてくれるだけでなく、一般的なアプローチに関するより深いフィードバックとアドバイスを提供してくれる回答をいただければ幸いです。

HTML は関係ないと思うので、JS コードのみを投稿しますが、必要に応じて投稿することもできます。

次のコードは、メイン クラスを定義しますSelect。Select次に、 calledのサブクラスを作成しますSelectNum(コードの最後を見てください)。では、 のメソッドSelectNumをオーバーライドしようとしていますが、完全ではありません。最初にスーパーの (Select の) メソッドを呼び出してから、追加のコードを実行したいと考えています。しかし、このサブクラスのメソッドが実行されると、すぐに次のエラーが発生します。mouseoverSelectmouseover

「キャッチされていない TypeError: 未定義のメソッド 'stop' を呼び出せません」

基本的にthis.shine未定義です。

まず、O'Reilly の JavaScript: The Definitive Guide の次のコードを使用しています。

そして私のコード：

EDIT Raynosからの応答が機能しました。this.sup.mouseover()エラーをスローしなくなり、正しいコードが実行されました。ただし、実際には というSelectNumサブクラスを作成する必要がありますSelectLevel。SelectNumスーパークラスのmouseover()メソッドをオーバーライドするのとは異なり、のメソッドSelectLevelをオーバーライドする必要はありません。SelectNummouseover()

このコードでは、mouseover()メソッドが継続的に呼び出されます。がオブジェクトにthisバインドされたためだと思います。そのため、行では常に参照されているため、自分自身を呼び出し続けます。SelectLevelthis.supthis.sup.mouseover()SelectNumSelectNum

this.sup[k] = this.sup[k].bind(this);でバインディングを削除するとSelectLevel、エラーが発生しますUncaught TypeError: Cannot call method 'mouseover' of undefined。はthis.sup.mouseover()継続的に呼び出さmouseoverれ、プロトタイプ チェーン内の各オブジェクトでメソッドを呼び出しているようです。に達するとObject、このエラーがスローされます。もちろん、 にはプロパティObjectがないためです。sup

this.sup[k] = this.sup[k].bind(this);のバインディングを削除し、メソッドを呼び出す前に最初にプロパティをチェックする if ステートメントで をSelectLevelラップすることで、これを解決できるようです。this.sup.mouseover()supmouseover()if(this.sup !== undefined)

最終的に、JavaScript でサブクラス化する方法について、何か基本的なことが欠けていると思います。これらの特定の問題に対する解決策は、プロトタイプの継承が JS でどのように機能するかを明らかにしますが、より広いレベルでよりよく理解する必要があると本当に思います。

次の Javascript スニペットを検討してください。

SubClass のインスタンスを作成すると、オブジェクトはプロパティ "a" と "x" を初期化しません。

なぜこれが起こるのかは理解できますが、サブクラスがスーパークラスコンストラクターによって行われた初期化を実行する最もクリーンな方法は何ですか?

私はResigのSimpleJavaScriptInheritanceを使用してクラスを作成しています。これまでのところ気に入らないのは、このライブラリで作成されたオブジェクトをコンソールに記録すると、その名前が単に「クラス」になることだけです。私の質問は、代わりにコンソールで実際のクラス名を取得するように彼のコードを変更する方法があるかどうかです。Chromeのコンソールの例を次に示します。

その名前「Class」を、次の場合と同じように、私が作成したクラスの実際の名前にしたいと思います。

これがResigのライブラリで発生する理由はわかっていると思います。実際のコンストラクター関数は、単に「クラス」という名前です。彼のライブラリのコードは次のとおりです。

このClass()関数は、約2/3のところにあります。コンソールでクラスの実際の名前を取得できるように、このコードを変更する方法を知っている人はいますか？

私はJavaScriptで関数を作成し、その関数にさらにメソッドと属性を追加できるのが好きです

これらのオブジェクトを生成するクラスを作成したいと思います。Function 基底クラスから継承する必要があると思います。

言い換えれば、私はしたい：

しかし、myFunctionClass の作成方法がわかりません。次のことを試しましたが、うまくいきません。

ここにあるより複雑な（そしてより適切な？）継承方法も試しました：How to "properly" create a custom object in JavaScript? 、もう運がありません。また、node.js にある util.inherits(myFunctionClass, Function) を使用してみました。まだ運がない

私は Google を使い果たしたので、基本的または明白な何かが欠けているに違いないと感じています。助けていただければ幸いです。

Douglas Crockford による JavaScript の入門講義を見たところです。その中で彼はobject、オブジェクトにパラメーターとしてリンクされた新しいオブジェクトを作成するために使用する関数について言及しています。彼の言いたいことは、私が言うなら

のobjB内部[[prototype]]参照は に設定されてobjAいますが、彼はそのように明示的に定式化していません。

一方、私は彼の本を読んだことがありますが、その中で彼はそのような関数についてまったく言及しておらず、代わりにプロトタイプからオブジェクトを作成する独自の方法を提示し、次の関数を定義しています。

基本的に、新しく作成されたオブジェクトnewの内部[[prototype]]リンクをコンストラクター関数のprototypeプロパティが指すものに設定するオペレーターの動作を利用します。

私の質問は、なぜ彼が組み込み関数を省略し、同じことを行う独自の方法を発明したのかということです。関数への以前の呼び出しはobject本当に同等ですか

それとも若干の違いはありますか？

JSでさまざまな継承手法を試したところ、Crockfordのプロトタイプの継承パターンについて少し不快なものに出くわしました。

コンソールにログインする場合を除いて、すべて問題ありません。オブジェクトはFとして表示されます。コンストラクターを再ポイントできる従来のエミュレーションを見てきましたが、オブジェクト（コンソール）参照を強制する同様の方法はありますか？

ベース オブジェクトからインスタンス プロパティを継承またはコピーする一連のオブジェクトを作成したいと考えています。これにより、どのパターンを使用するかについての決定に至りました。どの方法が「より良い」かについて、ご意見をお聞きしたいと思いました。

どちらも同じことを達成します。つまり、共通のテンプレートに基づく一意のインスタンス プロパティです。問題は、どちらがより「エレガント」かということです。