ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript の継承に「Derived.prototype = new Base」で「new」を使用するのはなぜですか?

JavaScript の継承に「Derived.prototype = new Base」で「new」を使用するのはなぜですか?

Patricia Arquette
リリース: 2024-12-21 04:27:10
オリジナル
207 人が閲覧しました

Why Use `new` in `Derived.prototype = new Base` for JavaScript Inheritance?

Derived.prototype = new Base で 'new' キーワードを使用する理由

JavaScript では、継承はプロトタイプによって実現されます。既存のクラスを拡張するには、子クラスのプロトタイプを親クラスの新しいインスタンスに割り当てます。ここで、「new」キーワードが登場します。

次のコード内:

WeatherWidget.prototype = new Widget;
ログイン後にコピー

「new」キーワードには 2 つの目的があります:

  • コンストラクター関数を呼び出します: これは、Widget クラスの新しいインスタンスを作成します。このインスタンスは WeatherWidget クラスのプロトタイプになります。
  • Prototype プロパティを設定します: コンストラクター呼び出しの戻り値 (つまり、Widget の新しいインスタンス) は、WeatherWidget クラスのプロトタイプ プロパティに割り当てられます。 WeatherWidget クラス。

「new」が左の場合はどうなるかアウトですか?

「new」がなければ、ウィジェット コンストラクターを呼び出すことはありません。代わりに、Widget() の引数リストを提供する必要があります。ただし、これは不可能な場合があり、エラーが発生する可能性があります。

プロパティを共有しないことの重要性

デフォルトでは、WeatherWidget のインスタンスは同じインスタンスのプロパティ値を共有します。ウィジェットの。 WeatherWidget の複数のインスタンスが互いのプロパティをオーバーライドまたは変更する可能性があるため、予期しない動作が発生する可能性があります。

これを防ぐには、「ダミー」コンストラクター (例: Dummy.prototype = Widget.prototype) を使用することをお勧めします。中間ステップとして、親インスタンスからプロパティ値を継承しない WeatherWidget の新しいプロトタイプを作成します。これにより、各 WeatherWidget インスタンスが独自の継承プロパティ セットを持つようになります。

新しい JavaScript バージョンでの代替アプローチ

ECMAScript 5 以降では、以下を使用できます。

WeatherWidget.prototype = Object.create(Widget.prototype, {
  constructor: {value: WeatherWidget}
});
ログイン後にコピー

このアプローチには、コンストラクター プロパティを書き込み不能にするという追加の利点もあります。

親コンストラクターの明示的な呼び出し

親コンストラクター (例: Widget.apply(this, argument)) を明示的に呼び出す必要がある場合があります。親を初期化するための子コンストラクターinstance.

結論

Derived.prototype = new Base での 'new' の使用を理解することは、JavaScript で継承を正しく実装するために重要です。これにより、子クラスが正しいプロトタイプから確実に継承され、インスタンス間でのプロパティ値の意図しない共有が防止されます。

以上がJavaScript の継承に「Derived.prototype = new Base」で「new」を使用するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート