JavaScript プロトタイプの拡張と上書き: どちらのアプローチが最適ですか?

JavaScript プロトタイプの定義: 違いを理解する

JavaScript でのオブジェクト プロトタイプの定義は、継承とコードの再利用性にとって不可欠です。ただし、プロトタイプ定義には、既存のプロトタイプを拡張するか、完全に上書きするという 2 つの一般的なアプローチがあります。

オプション 1: 既存のプロトタイプを拡張する

Person.prototype.sayName = function(name) {
   alert(name);
}

このアプローチ新しいメソッドsayNameを追加することで、現在のプロトタイプオブジェクト Person.prototype を拡張します。 Person の既存のインスタンスは、この新しいメソッドを継承します。

オプション 2: プロトタイプを上書きする

Person.prototype = {
   sayName: function(name) {
      alert(name);
   }
}

オプション 1 とは異なり、このアプローチでは、新しいプロトタイプ オブジェクトが Person に割り当てられます。 .prototype、元のものを上書きします。将来の Person のインスタンスのみが、sayName メソッドを継承します。

機能の違いと利点

主な機能の違いは、オプション 1 では、既存のインスタンスが新しいメソッドにアクセスできることです。一方、オプション 2 は将来のインスタンスにのみ影響します。

もう 1 つの違いは、プロトタイプ (オプション) を上書きすることです。 2)、元のプロトタイプで以前に定義されていた他のプロパティやメソッドを誤って破棄してしまいます。通常、これらにはコンストラクター プロパティのみが含まれますが、この潜在的な欠点に注意する価値があります。

推奨事項

オプション 1 (拡張) は、一般に、より簡潔で堅牢であると考えられています。 Person のすべてのインスタンスがsayName にアクセスできること。特別な理由でプロトタイプを再初期化する必要がない限り、オプション 2 は避けてください。

代替アプローチ

オプション 2 のオブジェクト リテラル構文に興味がある場合は、Object の使用を検討してください。既存のプロトタイプを拡張するために割り当てます:

Object.assign(Person.prototype, {
   sayName: function(name) {
      alert(name);
   }
});

以上がJavaScript プロトタイプの拡張と上書き: どちらのアプローチが最適ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。