introduire
Les décorateurs offrent des alternatives plus flexibles que l'héritage. Les décorateurs utilisent des objets utilisés pour envelopper la même interface, ce qui vous permet non seulement d'ajouter un comportement aux méthodes, mais également de définir les méthodes sur les appels d'objets originaux (comme le constructeur du décorateur).
Les décorateurs sont utilisés pour ajouter de nouvelles fonctions via la forme de méthodes surchargées. Ce mode peut ajouter son propre comportement avant ou après le décorateur pour atteindre un objectif spécifique.
texte
Alors, quels sont les avantages du mode décorateur? Comme mentionné précédemment, le décorateur est une alternative à la réalisation de l'héritage. Lorsque le script est en cours d'exécution, l'ajout d'un comportement à la sous-classe affecte toutes les instances de la classe d'origine, mais le décorateur ne le fait pas. Au lieu de cela, il peut ajouter un nouveau comportement à différents objets. Le code suivant ressemble:
La copie de code est la suivante:
// Classe (fonction) qui a besoin de décoration (fonction)
fonction macbook () {
this.cost = function () {
retour 1000;
};
}
Mémoire de fonction (MacBook) {
this.cost = function () {
return macbook.cost () + 75;
};
}
fonction bluraydrive (macbook) {
this.cost = function () {
return macbook.cost () + 300;
};
}
Assurance des fonctions (MacBook) {
this.cost = function () {
return macbook.cost () + 250;
};
}
// utilisation
var mymacbook = nouvelle assurance (new BluRayDrive (new Memory (new MacBook ())));
console.log (mymacbook.cost ());
Vous trouverez ci-dessous un autre exemple. Lorsque nous appelons PerpitTask sur l'objet décorateur, il a non seulement un comportement de décorateur, mais appelle également la fonction PerformTask de l'objet inférieur.
La copie de code est la suivante:
fonction concreteclass () {
this.performtask = function () {
this.pretask ();
console.log («faire quelque chose»);
this.postTask ();
};
}
fonction AbstractDecorator (décoré) {
this.performtask = function () {
décoré.performtask ();
};
}
fonction ConcreteDecoratorClass (décoré) {
this.base = abstractDecorator;
ce.base (décoré);
décoré.pretask = function () {
Console.log («pré-appelant ..»);
};
décoré.postTask = function () {
console.log ('post-appelant ..');
};
}
var béton = new ConcreteClass ();
Var Decorator1 = New ConcreteDeCoratorClass (béton);
var décorator2 = new ConcreteDeCoratorClass (Decorator1);
décorateur2.performtask ();
Prenons un autre exemple approfondi:
La copie de code est la suivante:
var arbre = {};
Tree.decorate = function () {
Console.log («Assurez-vous que l'arbre a gagné /« t chude »);
};
Tree.getDecorator = function (déco) {
arbre [déco] .prototype = this;
retourner un nouvel arbre [déco];
};
Tree.Redballs = function () {
this.decorate = function () {
this.redball.prototype.decorate (); // Étape 7: Exécutez d'abord le prototype (c'est Angel) Méthode décorer
console.log («mettre des boules rouges»); // Étape 8 Sortie rouge
// utilise ces 2 étapes comme méthode de décoration des boules rouges
}
};
Tree.Blueballs = fonction () {
this.decorate = function () {
this.blueball.prototype.decorate (); // Étape 1: Exécutez d'abord la méthode de décore du prototype, c'est-à-dire, arbre.decorate ()
console.log («ajouter des boules bleues»); // Étape 2 Sortie bleu
// utilise ces 2 étapes car la méthode des Blueball décore
}
};
arbre.angel = function () {
this.decorate = function () {
this.angel.prototype.decorate (); // Étape 4: Exécutez d'abord le prototype (c'est des Blueball) décorer la méthode
console.log («un ange sur le dessus»); // Étape 5 Sortie Angel
// utilise ces 2 étapes comme méthode de décoration d'Angel
}
};
Tree = Tree.getDecorator («Blueball»); // Étape 3: Attribuez l'objet Blueball à Tree, et le GetDecorator dans le prototype parent est toujours disponible
Tree = Tree.getDecorator ('Angel'); // Étape 6: attribuez l'objet ange à l'arbre. Pour le moment, le GetDecorator du prototype parent du prototype parent est toujours disponible
Tree = Tree.getDecorator ('Red Balls'); // Étape 9: Attribuez l'objet des boules rouges à l'arbre
Tree.Decorate (); // Étape 10: Exécutez la méthode de décorer de l'objet Redballs
Résumer
Le motif du décorateur est un moyen d'ajouter dynamiquement plus de fonctions aux fonctions existantes. Chaque fonction à décorer est placée dans une fonction distincte, puis utilisez cette fonction pour envelopper l'objet de fonction existant à décorer. Par conséquent, lorsque un comportement spécial doit être effectué, le code d'appel peut utiliser de manière sélective et séquentiellement la fonction de décoration pour envelopper l'objet au besoin. L'avantage est qu'il distingue les responsabilités de base de la classe (fonction) de la fonction décorative.