Maison > interface Web > js tutoriel > Comment empêcher les méthodes de tableau personnalisé et de prototype d'objet d'apparaître dans les boucles « for...in » ?

Comment empêcher les méthodes de tableau personnalisé et de prototype d'objet d'apparaître dans les boucles « for...in » ?

Barbara Streisand
Libérer: 2024-12-10 14:37:10
original
959 Les gens l'ont consulté

How to Prevent Custom Array and Object Prototype Methods from Appearing in `for...in` Loops?

Définition de méthodes sur Array.prototype et Object.prototype qui n'apparaissent pas dans les boucles

Lors de l'extension de prototypes de tableau ou d'objet avec des méthodes d'assistance comme find() ou filter(), il est crucial de s'assurer que ces méthodes n'apparaissent pas dans les boucles for in. Cela évite les problèmes potentiels et les problèmes de compatibilité.

Le problème : les méthodes affichées dans les boucles for in

En JavaScript, les boucles for in parcourent les propriétés d'un objet. Si vous définissez des méthodes personnalisées sur Array.prototype ou Object.prototype, ces méthodes apparaîtront comme propriétés dans les boucles 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
}
Copier après la connexion

Solution 1 : évitez les boucles for-in avec des tableaux

La solution la plus simple est d'éviter d'utiliser des boucles for-in avec des tableaux. Au lieu de cela, utilisez les méthodes for traditionnelles ou Array.prototype comme forEach() :

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

const arr = [1, 2, 3];

for (let i = 0; i < arr.length; i++) {
  // Do something with arr[i]
}
Copier après la connexion

Solution 2 : Vérifier la syntaxe de méthode obsolète

Pour gérer les boucles for-in obsolètes qui ne fonctionnent pas vérifiez l'existence de la méthode, vous pouvez ajouter une vérification de garde à la définition de votre méthode :

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

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

Solution 3 : Utiliser Object.defineProperty

ES5.1 a introduit Object.defineProperty, qui vous permet de définir des propriétés non énumérables sur des objets. Cela empêche les propriétés d'apparaître dans les boucles for in :

Object.defineProperty(Array.prototype, "find", {
  enumerable: false,
  // ...
Copier après la connexion

Conclusion

En utilisant les techniques ci-dessus, vous pouvez créer des méthodes personnalisées sur Array.prototype et Object.prototype qui n'interféreront pas avec des boucles for-in. Cela garantit la compatibilité et évite les problèmes potentiels pour d'autres codes qui dépendent du comportement attendu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal