Maison >interface Web >js tutoriel >Série trois de modèles de conception JavaScript : modèle de générateur

Série trois de modèles de conception JavaScript : modèle de générateur

不言
不言original
2018-04-02 13:58:421409parcourir

Cet article partage avec vous la troisième série de modèles de conception JavaScript : Modèle de constructeur Les amis intéressés peuvent jeter un œil à

Modèle de constructeur

Modèle de constructeur (modèle de constructeur) ) est relativement simple. Il s'agit d'une sorte de modèle de création. Il décompose un objet complexe en plusieurs objets simples pour la construction et sépare la couche de construction complexe de la couche de présentation, de sorte que le même processus de construction puisse créer différentes représentations. modèle.

Avantages

  • Le modèle de constructeur a une bonne encapsulation et l'objet lui-même est découplé du processus de construction.

  • Le mode Constructeur est facile à étendre. S'il y a de nouvelles exigences, cela peut être accompli en implémentant une nouvelle classe de constructeur.

Scénarios applicables

Les objets qui doivent être générés ont des structures internes complexes ; et les propriétés internes elles-mêmes dépendent les unes des autres


Code du modèle de générateur Il existe quatre parties principales pour implémenter le modèle de générateur

 : classe de produit, classe Builder, classe Director et client.

Le processus principal est le suivant :
  1. Les clients font valoir leurs exigences.

  2. Le commandant demande au constructeur de compléter chaque partie de l'exigence en fonction des besoins de l'utilisateur.

  3. Le constructeur réalise la partie correspondante.

Regardons le code correspondant :
La catégorie de produit est une voiture vide transformée.

/**
 * 产品类:car 目前需要构建一辆车。
 */

function car () {
    this.name = '',
    this.number = '',
    this.wheel = '',
    this.engine = ''
}

Regard suivant sur la classe de constructeur :

/* 
*    建造者类,里面有专门负责各个部分的工人
*/
function carBuilder () {
    this.nameBuilder = function () {
        this.name = '很厉害的车'
    },
    this.numberBuilder = function () {
        this.number = '88888888'
    },
    this.wheelBuilder = function () {
        this.wheel =  '高级橡胶做的轮子'
    },
    this.engineBuilder = function () {
        this.engine =  '很厉害的引擎'
    },
    this.getCar = function () {
        var Car = new car()
        Car.name = this.name;
        Car.number= this.number;
        Car.wheel = this.wheel;
        Car.engine = this.engine;
        return Car;
    }
}

Ici, nous pouvons voir les ouvriers dans chaque pièce et leur travail, et leur travail respectif est finalement fusionné en une seule voiture.

Classe de conducteur :

/**
 *   指挥者类,指挥各个部分的工人工作
 */
function director () {
    this.action = function (builder) {
        builder.nameBuilder();
        builder.numberBuilder();
        builder.wheelBuilder();
        builder.engineBuilder();
    } 
}

Enfin, la méthode d'utilisation :

/**
 *    使用方法
 */

var builder = new carBuilder();
var director = new director();
director.action(builder);
var Car = builder.getCar();
console.log(Car);

Le client final obtient la voiture via la méthode getCar et n'a pas besoin de connaître le détails de construction.


Résumé

Le modèle builder est principalement utilisé pour "distribuer la construction d'un objet complexe", et il est facile à étendre. S'il y a de nouvelles exigences, cela peut être accompli en implémentant une nouvelle classe de constructeur, et le modèle de constructeur dissocie l'objet lui-même du processus de construction, de sorte que nous n'avons pas besoin de nous soucier du processus de construction spécifique.

Recommandations associées :

JavaScript Design Pattern Series One : Factory Pattern

JavaScript Design Pattern Series Two : Singleton Pattern


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!

Déclaration:
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