Explication détaillée des cas d'utilisation des modèles de façade JS

Cette fois, je vais vous apporter une explication détaillée du cas d'utilisation du mode façade JS. Quelles sont les précautions lors de l'utilisation du mode façade JS. Ce qui suit est un cas pratique, jetons un coup d'œil.

Le motif de façade est un modèle de conception populaire qui crée une nouvelle interface pour un objet existant. La façade est un tout nouvel objet derrière lequel fonctionne un objet existant. Les façades sont parfois appelées wrappers, elles utilisent différentes interfaces pour envelopper des objets existants. Si l’héritage n’est pas suffisant pour votre cas d’utilisation, alors il est logique que la prochaine étape consiste à créer une façade.

jQuery et YUI utilisent tous deux des façades pour leurs interfaces DOM. Comme mentionné ci-dessus, vous ne pouvez pas hériter d'un objet DOM, donc la seule option pour y ajouter des fonctionnalités en toute sécurité est de créer une façade. Voici un exemple de code de wrapper d'objet DOM :

function DOMWrapper (element) {  this.element = element;
}
DOMWrapper.prototype.addClass = function (className) {  this.element.className += ' ' + className;
}
DOMWrapper.prototype.remove = function () {  this.element.parentNode.removeChild(this.element);
}// 用法var wrapper = new DOMWrapper(
document
.getElementById('my-div'));
wrapper.addClass('selected');
wrapper.remove();

Le type DOMWrapper attend qu'un élément DOM soit transmis à son constructeur. L'élément est enregistré pour référence ultérieure et définit certaines méthodes de manipulation de l'élément. La méthode addClass() est un moyen simple d'ajouter className aux éléments qui n'ont pas encore implémenté l'attribut HTML5 classList. La méthode Remove() encapsule l'opération de suppression d'un élément du DOM, protégeant ainsi les développeurs de la nécessité d'accéder au nœud parent de l'élément. En termes de maintenabilité de JS, les façades sont une méthode très adaptée. Vous pouvez contrôler entièrement ces interfaces. Vous pouvez autoriser l'accès aux propriétés ou méthodes de n'importe quel objet sous-jacent et vice versa, filtrant efficacement l'accès à cet objet. Vous pouvez également modifier les méthodes existantes pour les rendre plus simples et plus faciles à utiliser (l'exemple de code ci-dessus est un exemple). Quelle que soit la façon dont les objets sous-jacents changent, tant que la façade est modifiée, l'application peut continuer à fonctionner normalement.

Une façade qui implémente une interface spécifique pour faire ressembler un objet à un autre objet est appelée un adaptateur. La seule différence entre les façades et les adaptateurs est que les premières créent de nouvelles interfaces et les seconds implémentent les interfaces existantes.

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 éviter la comparaison nulle dans le développement Web

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

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!