カスタム配列およびオブジェクト プロトタイプ メソッドが「for...in」ループに表示されないようにするにはどうすればよいですか?

ループ内の for に現れない Array.prototype および Object.prototype のメソッドの定義

find() などのヘルパー メソッドを使用して Array または Object プロトタイプを拡張する場合または filter() を使用する場合、これらのメソッドが for in ループ内に出現しないようにすることが重要です。これにより、潜在的な問題や互換性の問題が回避されます。

問題: for in ループで表示されるメソッド

JavaScript では、for in ループはオブジェクトのプロパティを反復処理します。 Array.prototype または Object.prototype でカスタム メソッドを定義すると、これらのメソッドは for-in ループのプロパティとして表示されます:

Array.prototype.find = function(testFun) {
  // ...
};

const arr = [1, 2, 3];

for (let prop in arr) {
  console.log(prop); // Outputs: 1, 2, 3, find
}

解決策 1: 配列での for-in ループを避ける

最も簡単な解決策は、配列での for-in ループの使用を避けることです。代わりに、従来の for ループまたは forEach() のような Array.prototype メソッドを使用します:

Array.prototype.find = function(testFun) {
  // ...
};

const arr = [1, 2, 3];

for (let i = 0; i < arr.length; i++) {
  // Do something with arr[i]
}

解決策 2: 廃止されたメソッド構文を確認する

そうでない廃止された for-in ループを処理するにはメソッドの存在を確認するには、メソッド定義にガード チェックを追加できます。

Object.prototype.hasOwnProperty = function() {
  // ...
};

Array.prototype.find = function(testFun) {
  if (this.hasOwnProperty('find')) {
    // Method already exists, do something
  } else {
    // Add the method
  }
};

解決策3: Object.defineProperty

ES5.1 では、オブジェクトに列挙不可能なプロパティを定義できる Object.defineProperty が導入されました。これにより、プロパティが for in ループに表示されなくなります。

Object.defineProperty(Array.prototype, "find", {
  enumerable: false,
  // ...

結論

上記の手法を使用すると、干渉しない Array.prototype および Object.prototype のカスタム メソッドを作成できます。 for-in ループを使用します。これにより互換性が確保され、予期される動作に依存する他のコードの潜在的な問題が防止されます。

以上がカスタム配列およびオブジェクト プロトタイプ メソッドが「for...in」ループに表示されないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。