L'utilisation des annotations Polyfill et la prévention des modifications dans JS

Cette fois, je vais vous présenter l'utilisation des annotations Polyfill et la prévention des modifications en JS. Quelles sont les précautions concernant l'utilisation des annotations Polyfill et la prévention des modifications en JS. Ce qui suit est un cas pratique. , jetons un coup d'oeil.

Au fur et à mesure que les fonctionnalités d'ES5 et HTML5 sont progressivement implémentées par différents navigateurs. Les polyfills JS (également connus sous le nom de cales) sont devenus populaires. Un polyfill est une simulation de certaines fonctions entièrement définies et implémentées nativement dans les nouvelles versions des navigateurs. Par exemple, ES5 ajoute la fonction forEach() pour les tableaux. Cette méthode a une implémentation fictive dans ES3, vous pouvez donc l'utiliser dans des navigateurs plus anciens. La clé des polyfills est que leur implémentation fictive reste entièrement compatible avec l’implémentation native du navigateur. C’est justement parce qu’un petit nombre de navigateurs implémentent nativement ces fonctions qu’il est nécessaire de détecter autant que possible si leur traitement de ces fonctions est conforme aux standards dans différentes situations.

Afin d'atteindre leurs objectifs, les polyfills ajoutent souvent certaines méthodes aux objets qui ne leur appartiennent pas . Je ne suis pas fan des polyfills, mais je comprends que d'autres les utilisent. Par rapport à d'autres modifications d'objets, les polyfills sont limités et relativement sûrs. Étant donné que ces méthodes existent et fonctionnent dans l'implémentation native, les polyfills ajoutent ces méthodes uniquement lorsque les méthodes natives n'existent pas, et leur comportement est exactement le même que celui des méthodes de la version native.

L'avantage des polyfills est qu'ils peuvent être supprimés très facilement si le navigateur fournit une implémentation native. Si vous utilisez des polyfills, vous devez savoir quels navigateurs proposent des implémentations natives. Et assurez-vous que l'implémentation des polyfills est totalement cohérente avec l'implémentation native du navigateur, et vérifiez si la bibliothèque de classes fournit des cas de test pour vérifier l'exactitude de ces méthodes. L'inconvénient des polyfills est que leur implémentation peut être imprécise par rapport à l'implémentation native du navigateur, ce qui peut vous causer bien des ennuis, et autant ne pas l'implémenter.

Pour une meilleure maintenabilité, évitez d'utiliser des polyfills et créez plutôt des façades au-dessus des fonctionnalités existantes. Cette approche vous offre la plus grande flexibilité, ce qui est particulièrement important lorsqu'il y a des bugs dans l'implémentation native (en évitant les polyfills). Dans ce cas, vous ne souhaitez pas utiliser directement l’API native, sinon vous ne pourrez pas isoler les bugs dans l’implémentation native.

ES5 introduit plusieurs méthodes pour empêcher la modification des objets. Il est important de comprendre ces capacités afin que vous puissiez maintenant faire quelque chose comme verrouiller ces objets afin que personne ne puisse modifier les fonctionnalités qu'il n'a pas prévu, intentionnellement ou non. Les navigateurs actuels (2018) prennent en charge ces fonctionnalités d'ES5, et il existe trois niveaux de modifications de verrouillage :

Empêcher l'extension (Object.preventExtension()) : interdire "l'ajout" aux objets Propriétés et méthodes, mais les propriétés et méthodes existantes peuvent être modifiées ou supprimées

Scellement (Object.seal()) : similaire à "empêcher l'expansion", et interdit la "suppression" pour les objets "Propriétés existantes et méthodes

Freeze (Object.freeze()) : similaire au "sealing", et il est interdit de "modifier" les propriétés et méthodes existantes pour l'objet (tous les champs sont en lecture seule)

Chaque type de verrou dispose de deux méthodes : une pour effectuer l'opération et l'autre pour détecter si l'opération correspondante a été appliquée. Pour empêcher l'expansion, les deux fonctions Object.preventExtension() et Object.isExtensible() peuvent être utilisées. Vous pouvez vérifier l’utilisation des méthodes associées sur MDN, je n’entrerai donc pas dans les détails ici.

L'utilisation de ces méthodes dans ES5 est un excellent moyen de garantir que votre projet n'est pas verrouillé pour modification sans votre consentement. Si vous êtes l'auteur d'une base de code, vous souhaiterez probablement verrouiller certaines parties de la bibliothèque principale pour vous assurer qu'elles ne soient pas modifiées accidentellement, ou pour forcer les zones qui permettent aux extensions de survivre. Si vous êtes un développeur d'applications, verrouillez toutes les parties de l'application que vous ne souhaitez pas modifier. Dans les deux cas, les méthodes de verrouillage ci-dessus ne peuvent être utilisées qu'après que les fonctions de ces objets ont été entièrement définies. Une fois qu'un objet est verrouillé, il ne peut plus être déverrouillé.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment détecter les valeurs originales dans le développement Web

Pourquoi vous devez éviter d'utiliser global variables dans le développement web

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!