Maison interface Web js tutoriel Explication détaillée de la programmation de modèles de stratégie JavaScript_Connaissances de base

Explication détaillée de la programmation de modèles de stratégie JavaScript_Connaissances de base

May 16, 2016 pm 03:53 PM
javascript 策略模式

J'aime le modèle de conception de stratégie. J'essaie de l'utiliser autant que possible. À la base, le modèle Strategy utilise des délégués pour découpler les classes d’algorithmes qui les utilisent.

Il y a plusieurs avantages à faire cela. Cela empêche l'utilisation d'instructions conditionnelles volumineuses pour décider quels algorithmes utiliser pour des types spécifiques d'objets. La séparation des préoccupations réduit ainsi la complexité du client tout en facilitant le sous-classement. Il améliore la modularité et la testabilité. Chaque algorithme peut être testé individuellement. Chaque client peut simuler des algorithmes. N'importe quel client peut utiliser n'importe quel algorithme. Ils peuvent intermoduler. Tout comme les Lego.

Pour mettre en œuvre le modèle de stratégie, il y a généralement deux participants :

L'objet de cette stratégie encapsule l'algorithme.

Objet client (contextuel) qui peut utiliser n'importe quelle stratégie de manière plug-and-play.

Voici une introduction à la façon dont j'utilise le modèle de stratégie en Javascript et comment l'utiliser dans un environnement chaotique pour diviser la bibliothèque en petits plug-ins et packages plug-and-play.

Les fonctions comme stratégies

Une fonction constitue un excellent moyen d'encapsuler un algorithme et peut être utilisée comme stratégie. Transmettez simplement une fonction au client et assurez-vous que votre client peut appeler la politique.

Utilisons un exemple pour prouver. Supposons que nous souhaitions créer une classe Greeter. Il suffit de dire bonjour aux gens. Nous voulons que la classe Greeter connaisse les différentes manières de saluer les gens. Pour mettre en œuvre cette idée, nous créons différentes stratégies de salutations.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

// Greeter is a class of object that can greet people.

// It can learn different ways of greeting people through

// 'Strategies.'

//

// This is the Greeter constructor.

var Greeter = function(strategy) {

this.strategy = strategy;

};

  

// Greeter provides a greet function that is going to

// greet people using the Strategy passed to the constructor.

Greeter.prototype.greet = function() {

return this.strategy();

};

  

// Since a function encapsulates an algorithm, it makes a perfect

// candidate for a Strategy.

//

// Here are a couple of Strategies to use with our Greeter.

var politeGreetingStrategy = function() {

console.log("Hello.");

};

  

var friendlyGreetingStrategy = function() {

console.log("Hey!");

};

  

var boredGreetingStrategy = function() {

console.log("sup.");

};

  

// Let's use these strategies!

var politeGreeter = new Greeter(politeGreetingStrategy);

var friendlyGreeter = new Greeter(friendlyGreetingStrategy);

var boredGreeter = new Greeter(boredGreetingStrategy);

  

console.log(politeGreeter.greet()); //=> Hello.

console.log(friendlyGreeter.greet()); //=> Hey!

console.log(boredGreeter.greet()); //=> sup.

Copier après la connexion

Dans l'exemple ci-dessus, Greeter est le client et a trois stratégies. Comme vous pouvez le constater, Greeter sait comment utiliser l’algorithme, mais n’a aucune idée des détails de l’algorithme.

Pour les algorithmes complexes, une fonction simple ne peut souvent pas satisfaire. Dans ce cas, la meilleure approche est de le définir en termes d’objets.

Les cours comme stratégies

Les stratégies peuvent également être des classes, surtout lorsque le calcul est plus complexe que l'artificiel (politique/algorithme) utilisé dans l'exemple ci-dessus. L'utilisation de classes permet de définir une interface pour chaque stratégie.

Dans l'exemple ci-dessous, cela est confirmé.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

// We can also leverage the power of Prototypes in Javascript to create

// classes that act as strategies.

//

// Here, we create an abstract class that will serve as the interface

// for all our strategies. It isn't needed, but it's good for documenting

// purposes.

var Strategy = function() {};

  

Strategy.prototype.execute = function() {

 throw new Error('Strategy#execute needs to be overridden.')

};

  

// Like above, we want to create Greeting strategies. Let's subclass

// our Strategy class to define them. Notice that the parent class

// requires its children to override the execute method.

var GreetingStrategy = function() {};

GreetingStrategy.prototype = Object.create(Strategy.prototype);

  

// Here is the `execute` method, which is part of the public interface of

// our Strategy-based objects. Notice how I implemented this method in term of

// of other methods. This pattern is called a Template Method, and you'll see

// the benefits later on.

GreetingStrategy.prototype.execute = function() {

 return this.sayHi() + this.sayBye();

};

  

GreetingStrategy.prototype.sayHi = function() {

 return "Hello, ";

};

  

GreetingStrategy.prototype.sayBye = function() {

 return "Goodbye.";

};

  

// We can already try out our Strategy. It requires a little tweak in the

// Greeter class before, though.

Greeter.prototype.greet = function() {

 return this.strategy.execute();

};

  

var greeter = new Greeter(new GreetingStrategy());

greeter.greet() //=> 'Hello, Goodbye.'

Copier après la connexion

En utilisant une classe, nous définissons une stratégie avec un objet méthode d'exécution. Les clients peuvent implémenter cette interface en utilisant n'importe quelle stratégie.

Remarquez également comment j'ai créé la GreetingStrategy. La partie intéressante est la surcharge de methodexecute. Il est défini sous la forme d'autres fonctions. Désormais, les sous-classes suivantes de la classe peuvent modifier des comportements spécifiques, tels que la méthodesayHiorsayBye, sans modifier l'algorithme général. Ce modèle est appelé méthode modèle et convient très bien au modèle de stratégie.

Voyons ce qui se passe.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

// Since the GreetingStrategy#execute method uses methods to define its algorithm,

// the Template Method pattern, we can subclass it and simply override one of those

// methods to alter the behavior without changing the algorithm.

  

var PoliteGreetingStrategy = function() {};

PoliteGreetingStrategy.prototype = Object.create(GreetingStrategy.prototype);

PoliteGreetingStrategy.prototype.sayHi = function() {

 return "Welcome sir, ";

};

  

var FriendlyGreetingStrategy = function() {};

FriendlyGreetingStrategy.prototype = Object.create(GreetingStrategy.prototype);

FriendlyGreetingStrategy.prototype.sayHi = function() {

 return "Hey, ";

};

  

var BoredGreetingStrategy = function() {};

BoredGreetingStrategy.prototype = Object.create(GreetingStrategy.prototype);

BoredGreetingStrategy.prototype.sayHi = function() {

 return "sup, ";

};

  

var politeGreeter  = new Greeter(new PoliteGreetingStrategy());

var friendlyGreeter = new Greeter(new FriendlyGreetingStrategy());

var boredGreeter  = new Greeter(new BoredGreetingStrategy());

  

politeGreeter.greet();  //=> 'Welcome sir, Goodbye.'

friendlyGreeter.greet(); //=> 'Hey, Goodbye.'

boredGreeter.greet();  //=> 'sup, Goodbye.'

Copier après la connexion

GreetingStrategy crée un algorithme de classe en spécifiant les étapes de la méthode d'exécution. Dans l'extrait de code ci-dessus, nous en profitons en créant un algorithme spécialisé.

Sans sous-classement, notre Greeter présente toujours un comportement polymorphe. Il n'est pas nécessaire de basculer entre différents types de Greeter pour déclencher le bon algorithme. Tout cela est lié à chaque objet Greeter.

1

2

3

4

5

6

7

8

9

10

11

12

13

var greeters = [

 new Greeter(new BoredGreetingStrategy()),

 new Greeter(new PoliteGreetingStrategy()),

 new Greeter(new FriendlyGreetingStrategy()),

];

  

greeters.forEach(function(greeter) {

   

 // Since each greeter knows its strategy, there's no need

 // to do any type checking. We just greet, and the object

 // knows how to handle it.

 greeter.greet();

});

Copier après la connexion

Mode stratégie dans plusieurs environnements

L'un de mes exemples préférés de modèle de stratégie se trouve dans la bibliothèque Passport.js. Passport.js fournit un moyen simple de gérer l'authentification dans Node. Un large éventail de fournisseurs le soutiennent (Facebook, Twitter, Google, etc.), chacun étant mis en œuvre sous forme de politique.

La bibliothèque est disponible sous forme de package npm, comme le sont toutes ses stratégies. Les utilisateurs de la bibliothèque peuvent décider quel package npm installer pour leurs cas d'utilisation uniques. Voici un extrait de code montrant comment cela se fait :

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

// Taken from http://passportjs.org

  

var passport = require('passport')

    

  // Each authentication mechanism is provided as an npm package.

  // These packages expose a Strategy object.

 , LocalStrategy = require('passport-local').Strategy

 , FacebookStrategy = require('passport-facebook').Strategy;

  

// Passport can be instanciated using any Strategy.

passport.use(new LocalStrategy(

 function(username, password, done) {

  User.findOne({ username: username }, function (err, user) {

   if (err) { return done(err); }

   if (!user) {

    return done(null, false, { message: 'Incorrect username.' });

   }

   if (!user.validPassword(password)) {

    return done(null, false, { message: 'Incorrect password.' });

   }

   return done(null, user);

  });

 }

));

  

// In this case, we instanciate a Facebook Strategy

passport.use(new FacebookStrategy({

  clientID: FACEBOOK_APP_ID,

  clientSecret: FACEBOOK_APP_SECRET,

  callbackURL: "http://www.example.com/auth/facebook/callback"

 },

 function(accessToken, refreshToken, profile, done) {

  User.findOrCreate(..., function(err, user) {

   if (err) { return done(err); }

   done(null, user);

  });

 }

));

Copier après la connexion

La bibliothèque Passport.js n'est livrée qu'avec un ou deux mécanismes d'authentification simples. En dehors de cela, il n’a pas d’interface au-delà d’une classe de stratégie conforme à l’objet contextuel. Ce mécanisme permet à ses utilisateurs de mettre en œuvre facilement leurs propres mécanismes d'authentification sans nuire au projet.

Réflexion

Le modèle Strategy fournit un moyen d'augmenter la modularité et la testabilité de votre code. Cela ne signifie pas que (le modèle de stratégie) fonctionne toujours. Les mixins peuvent également être utilisés pour injecter des fonctionnalités, telles que des algorithmes, dans un objet au moment de l'exécution. Le polymorphisme plat du typage du vieux canard peut parfois être assez simple.

Cependant, l'utilisation du modèle Strategy vous permet de faire évoluer votre code à mesure que votre charge de travail augmente sans introduire une grande architecture au début. Comme nous l'avons vu avec l'exemple Passport.js, il deviendra plus facile pour les responsables d'ajouter des stratégies supplémentaires à l'avenir.

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment mettre en œuvre un système de reconnaissance vocale en ligne à l'aide de WebSocket et JavaScript Comment mettre en œuvre un système de reconnaissance vocale en ligne à l'aide de WebSocket et JavaScript Dec 17, 2023 pm 02:54 PM

Comment utiliser WebSocket et JavaScript pour mettre en œuvre un système de reconnaissance vocale en ligne Introduction : Avec le développement continu de la technologie, la technologie de reconnaissance vocale est devenue une partie importante du domaine de l'intelligence artificielle. Le système de reconnaissance vocale en ligne basé sur WebSocket et JavaScript présente les caractéristiques d'une faible latence, d'un temps réel et d'une multiplateforme, et est devenu une solution largement utilisée. Cet article explique comment utiliser WebSocket et JavaScript pour implémenter un système de reconnaissance vocale en ligne.

WebSocket et JavaScript : technologies clés pour mettre en œuvre des systèmes de surveillance en temps réel WebSocket et JavaScript : technologies clés pour mettre en œuvre des systèmes de surveillance en temps réel Dec 17, 2023 pm 05:30 PM

WebSocket et JavaScript : technologies clés pour réaliser des systèmes de surveillance en temps réel Introduction : Avec le développement rapide de la technologie Internet, les systèmes de surveillance en temps réel ont été largement utilisés dans divers domaines. L'une des technologies clés pour réaliser une surveillance en temps réel est la combinaison de WebSocket et de JavaScript. Cet article présentera l'application de WebSocket et JavaScript dans les systèmes de surveillance en temps réel, donnera des exemples de code et expliquera leurs principes de mise en œuvre en détail. 1. Technologie WebSocket

Comment mettre en œuvre un système de réservation en ligne à l'aide de WebSocket et JavaScript Comment mettre en œuvre un système de réservation en ligne à l'aide de WebSocket et JavaScript Dec 17, 2023 am 09:39 AM

Comment utiliser WebSocket et JavaScript pour mettre en œuvre un système de réservation en ligne. À l'ère numérique d'aujourd'hui, de plus en plus d'entreprises et de services doivent fournir des fonctions de réservation en ligne. Il est crucial de mettre en place un système de réservation en ligne efficace et en temps réel. Cet article explique comment utiliser WebSocket et JavaScript pour implémenter un système de réservation en ligne et fournit des exemples de code spécifiques. 1. Qu'est-ce que WebSocket ? WebSocket est une méthode full-duplex sur une seule connexion TCP.

Comment utiliser JavaScript et WebSocket pour mettre en œuvre un système de commande en ligne en temps réel Comment utiliser JavaScript et WebSocket pour mettre en œuvre un système de commande en ligne en temps réel Dec 17, 2023 pm 12:09 PM

Introduction à l'utilisation de JavaScript et de WebSocket pour mettre en œuvre un système de commande en ligne en temps réel : avec la popularité d'Internet et les progrès de la technologie, de plus en plus de restaurants ont commencé à proposer des services de commande en ligne. Afin de mettre en œuvre un système de commande en ligne en temps réel, nous pouvons utiliser les technologies JavaScript et WebSocket. WebSocket est un protocole de communication full-duplex basé sur le protocole TCP, qui peut réaliser une communication bidirectionnelle en temps réel entre le client et le serveur. Dans le système de commande en ligne en temps réel, lorsque l'utilisateur sélectionne des plats et passe une commande

JavaScript et WebSocket : créer un système efficace de prévisions météorologiques en temps réel JavaScript et WebSocket : créer un système efficace de prévisions météorologiques en temps réel Dec 17, 2023 pm 05:13 PM

JavaScript et WebSocket : Construire un système efficace de prévisions météorologiques en temps réel Introduction : Aujourd'hui, la précision des prévisions météorologiques revêt une grande importance pour la vie quotidienne et la prise de décision. À mesure que la technologie évolue, nous pouvons fournir des prévisions météorologiques plus précises et plus fiables en obtenant des données météorologiques en temps réel. Dans cet article, nous apprendrons comment utiliser la technologie JavaScript et WebSocket pour créer un système efficace de prévisions météorologiques en temps réel. Cet article démontrera le processus de mise en œuvre à travers des exemples de code spécifiques. Nous

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript : Comment obtenir le code d'état HTTP, des exemples de code spécifiques sont requis Préface : Dans le développement Web, l'interaction des données avec le serveur est souvent impliquée. Lors de la communication avec le serveur, nous devons souvent obtenir le code d'état HTTP renvoyé pour déterminer si l'opération a réussi et effectuer le traitement correspondant en fonction de différents codes d'état. Cet article vous apprendra comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournira quelques exemples de codes pratiques. Utilisation de XMLHttpRequest

Quels sont les cas d'application pratiques du modèle de stratégie dans le framework Java ? Quels sont les cas d'application pratiques du modèle de stratégie dans le framework Java ? Jun 05, 2024 pm 08:44 PM

Le modèle de stratégie dans le framework Java est utilisé pour modifier dynamiquement le comportement des classes. Les applications spécifiques incluent : Framework Spring : validation des données et gestion du cache Framework JakartaEE : gestion des transactions et injection de dépendances Framework JSF : convertisseurs et validateurs, gestion du cycle de vie des réponses.

Comment obtenir facilement le code d'état HTTP en JavaScript Comment obtenir facilement le code d'état HTTP en JavaScript Jan 05, 2024 pm 01:37 PM

Introduction à la méthode d'obtention du code d'état HTTP en JavaScript : Dans le développement front-end, nous devons souvent gérer l'interaction avec l'interface back-end, et le code d'état HTTP en est une partie très importante. Comprendre et obtenir les codes d'état HTTP nous aide à mieux gérer les données renvoyées par l'interface. Cet article explique comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournit des exemples de code spécifiques. 1. Qu'est-ce que le code d'état HTTP ? Le code d'état HTTP signifie que lorsque le navigateur lance une requête au serveur, le service

See all articles