コンストラクター関数内でプロトタイプ メソッドを割り当てることが、JavaScript では一般的に悪い習慣であると考えられているのはなぜですか?

コンストラクター内でのプロトタイプ メソッドの割り当て: 潜在的な欠点とスコープの問題

スタイルの好みを優先しながら、潜在的な欠点とスコープの問題に対処することが重要ですコンストラクター関数内のプロトタイプ メソッドの割り当てに関連しています。次のコード構造を考えてみましょう。

構造 1:

<code class="javascript">var Filter = function(category, value) {
  this.category = category;
  this.value = value;

  // product is a JSON object
  Filter.prototype.checkProduct = function(product) {
    // run some checks
    return is_match;
  }
};</code>

構造 2:

<code class="javascript">var Filter = function(category, value) {
  this.category = category;
  this.value = value;
};

Filter.prototype.checkProduct = function(product) {
  // run some checks
  return is_match;
}</code>

欠点とスコープの問題:

1.繰り返されるプロトタイプの割り当てと関数の作成:
構造 1 では、インスタンスの作成ごとにプロトタイプが何度も再割り当てされます。これにより、代入が繰り返されるだけでなく、インスタンスごとに新しい関数オブジェクトが作成されます。

2.予期しないスコープの問題:
構造 1 は予期しないスコープの問題を引き起こす可能性があります。プロトタイプ メソッドがコンストラクターのローカル変数を参照する場合、最初の構造体が意図しない動作を引き起こす可能性があります。次の例を考えてみましょう:

<code class="javascript">var Counter = function(initialValue) {
  var value = initialValue;

  // product is a JSON object
  Counter.prototype.get = function() {
      return value++;
  }
};

var c1 = new Counter(0);
var c2 = new Counter(10);
console.log(c1.get());    // outputs 10, should output 0</code>

この場合、各インスタンスに対して作成された get メソッドは、同じプロトタイプ オブジェクトを共有します。その結果、値変数がインクリメントされ、インスタンス間で共有され、誤った出力が発生します。

その他の考慮事項:

• 構造 1 は、外部からのアクセスを防止します。 Filter.prototype.checkProduct.apply() を介してプロトタイプを作成します。
• パフォーマンスの観点からは、メソッドをオブジェクト インスタンスに直接割り当てる方が、プロトタイプを使用するよりも効率的である可能性があります。
• コンストラクターは、特にローカル変数を参照する場合に、プログラミング上の間違いにつながる可能性があります。

結論:

個人の好みは異なる場合がありますが、潜在的な可能性を認識することが重要です。コンストラクター関数内でのプロトタイプ メソッドの割り当てに関連する欠点とスコープの問題。信頼性と保守性を考慮すると、通常は 2 番目のコード構造が推奨されます。

以上がコンストラクター関数内でプロトタイプ メソッドを割り当てることが、JavaScript では一般的に悪い習慣であると考えられているのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。