JavaScript : Quels sont les dangers de l'extension de Array.prototype ?

Question

Guide de style JavaScript de Google déconseille d'étendre le Array.prototype . Cependant, j'ai utilisé Array.prototype.filter = Array.prototype.filter || function(...) {...} comme un moyen de l'avoir (et des méthodes similaires) dans des navigateurs où ils n'existent pas. MDN fournit actuellement exemple similaire .

Je suis au courant de Object.prototype mais Array n'est pas une table de hachage.

Quels problèmes peuvent survenir lors de l'extension Array.prototype qui a poussé Google à le déconseiller ?

Answer 1

La plupart des gens n'ont pas compris ce qui s'est passé. Le polyfilling ou le shimming de fonctionnalités standard comme Array.prototype.filter pour qu'il fonctionne dans les anciens navigateurs est une bonne idée à mon avis. N'écoutez pas les détracteurs. Mozilla vous montre même comment faire sur le MDN. Habituellement, les conseils pour ne pas étendre Array.prototype ou d'autres prototypes natifs pourrait se résumer à l'un de ceux-ci :

1. for..in pourrait ne pas fonctionner correctement
2. Quelqu'un d'autre pourrait également vouloir étendre Array avec le même nom de fonction.
3. Il se peut qu'il ne fonctionne pas correctement dans tous les navigateurs, même avec la cale.

Voici mes réponses :

1. Vous n'avez pas besoin d'utiliser for..in sur Array d'habitude. Si vous le faites, vous pouvez utiliser hasOwnProperty pour être sûr que c'est légitime.
2. N'étendez les natifs que lorsque vous savez que vous êtes le seul à le faire. OU alors qu'il s'agit de choses standard comme Array.prototype.filter .
3. C'est ennuyeux et ça m'a piqué. Le vieil IE a parfois des problèmes pour ajouter ce genre de fonctionnalité. Il faut voir si cela fonctionne au cas par cas. Pour moi, le problème était d'ajouter Object.keys à IE7. Il semblait ne plus fonctionner dans certaines circonstances. Votre kilométrage peut varier.

Vérifiez ces références :

• http://perfectionkills.com/extending-native-builtins/
• http://blip.tv/jsconf/jsconf2011-andrew-dupont-everything-is-permitted-extending-built-ins-5211542
• https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/filter
• https://github.com/kriskowal/es5-shim

Bonne chance !

Answer 2

Je vais vous donner les points, avec les phrases clés, de l'excellent article de Nicholas Zakas JavaScript maintenable : Ne modifiez pas les objets que vous ne possédez pas :

• Fiabilité : "L'explication simple est qu'un logiciel d'entreprise a besoin d'un environnement d'exécution cohérent et fiable pour être maintenable."
• Implémentations incompatibles : "Un autre péril de la modification d'objets qui ne vous appartiennent pas est la possibilité de collisions de noms et d'implémentations incompatibles."
• Et si tout le monde le faisait ? : "Pour faire simple : si tous les membres de votre équipe modifiaient des objets qui ne leur appartiennent pas, vous seriez rapidement confrontés à des collisions de noms, à des implémentations incompatibles et à des cauchemars de maintenance."

En gros, ne le faites pas. Même si votre projet ne sera jamais utilisé par quelqu'un d'autre, et que vous n'allez jamais importer du code tiers, ne le faites pas. Vous prendrez une mauvaise habitude dont vous aurez du mal à vous défaire lorsque vous commencerez à essayer de coopérer avec les autres.

Answer 3

Extension du site Array.prototype dans votre propre code d'application est sans danger (sauf si vous utilisez for .. in sur les tableaux, auquel cas vous devez payer pour cela et vous amuser à les refacturer).

L'extension des objets hôtes natifs dans les bibliothèques que vous voulez que d'autres utilisent n'est pas cool. Vous n'avez pas le droit de corrompu l'environnement des autres personnes dans votre propre bibliothèque.

Soit vous le faites derrière une méthode facultative comme lib.extendNatives() ou avoir [].filter comme une exigence.

Extension des objets natifs et des objets hôtes

Answer 4

Prototype fait ça. C'est diabolique. L'extrait suivant montre comment cela peut produire des résultats inattendus :

<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
<script language="javascript">
  a = ["not", "only", "four", "elements"];
  for (var i in a)
    document.writeln(a[i]);
</script>

Le résultat :

not only four elements function each(iterator, context) { var index = 0; . . .

et environ 5000 caractères de plus.

Answer 5

Certaines personnes utilisent for ... in boucles pour itérer dans les tableaux. Si vous ajoutez une méthode au prototype, la boucle essaiera également d'itérer dans des tableaux. que clé. Bien sûr, vous ne devrait pas l'utiliser pour cela, mais certaines personnes le font quand même.