Maison > Article > interface Web > Modèle de conception JavaScript, première série : modèle d'usine
Cet article partage avec vous la série de modèles de conception JavaScript : Factory Pattern. Les amis intéressés peuvent jeter un œil au
设计模式(design pattern)
Concept :
Oui. Un ensemble d'utilisations répétées, de réflexion mature, de classification et de résumé d'innombrables expériences pratiques de conception. Il s'agit de rendre le code réutilisable, extensible, découplé, plus facile à comprendre et d'assurer la fiabilité du code.
Il y a 23 modèles de conception au total, je vais y jeter un oeil aujourd'hui 工厂模式(Factory Pattern)
Les autres modèles vous seront expliqués dans les prochains blogs.
Avant-propos : Cette série de codes a été téléchargée sur l'adresse GitHub https://github.com/HolyZheng/...
Factory mode, tout comme comme son nom l'indique, elle peut produire ce que l'on veut comme une usine, à condition que nous fournissions les matières premières. Dans notre processus de codage quotidien, il est très probable que nous ayons utilisé le modèle d'usine sans le savoir. Regardons un exemple simple :
//工厂模式很基础的的一个例子 function createPerson (name,age) { var person = new Object(); person.name = name; person.age = age; return person; } var Holz = createPerson ("Holz", "21"); console.log(Holz); /* { age: "21", name: "Holz" } */ var Tom = createPerson ("Tom", "7"); console.log(Tom); /* { age: "7", name: "Tom" } */
Dans cette fonction, je peux créer des objets avec différentes valeurs de paramètres en passant différents paramètres. Comme vous pouvez le constater, le modèle d’usine est en réalité très simple.
Le modèle d'usine est principalement divisé en motif d'usine simple et en motif d'usine abstrait.
简单工厂(Simple Factory Pattern)
Le motif est principalement utilisé pour créer des objets du même type. Par exemple, nous avons besoin d'une identité, d'un enseignant ou d'un élève pour créer. Vous pouvez utiliser la fonction suivante :
//简单工厂模式。 var simpleCreatePerson = function (type, person) { return this[type](person); } simpleCreatePerson.prototype = { student: function (person) { var Astudent = new Object(); Astudent.name = person.name; Astudent.age = person.age; return Astudent; }, teacher: function (person) { var Ateacher = new Object(); Ateacher.name = person.name; Ateacher.age = person.age; return Ateacher; } } var teacher = new simpleCreatePerson("teacher", {name:"郑老师", age:25 }); var student = new simpleCreatePerson("student", {name:"郑同学", age:21 }); console.log(teacher); /* this is a teacher {name:"郑老师", age: 25} */ console.log(student); /* this is a teacher {name:"郑同学", age: 25} */
Nous pouvons transmettre différents types tels que "étudiant" ou "enseignant" pour créer différents objets, puis utiliser différents objets personne pour attribuer des valeurs aux propriétés à l'intérieur. "Étudiant" et "enseignant" sont tous deux des personnes, donc la fonction d'usine simple est utilisée pour créer différentes instances du même type d'objet.
Le code ci-dessus utilise le prototype _prototype_
pour ajouter deux fonctions. (Les connaissances sur les prototypes ne peuvent pas être expliquées en une ou deux phrases. Si vous ne comprenez pas, vous pouvez rechercher des informations pertinentes sur Internet. . Comprendre), puis sélectionnez différentes méthodes via this[type]. Si vous ne comprenez pas ici, je peux l'expliquer. Il s'agit d'un objet pointant vers la fonction actuelle (en JavaScript, la fonction est un objet), et puis ceci. [nom de l'attribut/nom de la méthode] Pour appeler des propriétés ou des méthodes internes, alors ce[type] (personne) appelle la méthode correspondante pour instancier une classe spécifique (étudiant ou enseignant). Appelé via ce[type] (personne).
Il s’agit d’une simple fonction d’usine.
抽象工厂模式
: Différentes des fonctions d'usine simples, les fonctions d'usine abstraites concevront d'abord l'interface et l'implémentation spécifique sera effectuée dans la sous-classe. Le concept est un peu vague de cette façon, regardons un exemple :
Nous définissons une classe parent, abstractCreatePerson
c'est-à-dire créons une personne, et ensuite cette personne a une méthode pour se présenter selfIntroduction
, donc différentes personnes ont un contenu d'introduction différent. Pour le moment, nous pouvons utiliser le modèle de fabrique abstraite :
var abstractCreatePerson = function () {}; abstractCreatePerson.prototype = { selfIntroduction: function () { throw new Error("请先实例化此方法!"); } } var student = Object.create(abstractCreatePerson.prototype); student.selfIntroduction = function () { console.log("I am a sutdent, my name is holz!"); } student.selfIntroduction(); /* I am a sutdent, my name is holz! */ var teacher = Object.create(abstractCreatePerson.prototype); teacher.selfIntroduction = function () { console.log("I am a teacher, my name is xxxx!"); } teacher.selfIntroduction(); /* I am a teacher, my name is xxxx! */
Vous pouvez voir ce code. La classe parent abstractCreatePerson
déclare d'abord une méthode, puis. passe la méthode Object .create() pour hériter de cette classe parent (car cela n'écrasera pas la chaîne de prototypes d'origine), puis nous instancions la méthode dans la sous-classe. Différentes sous-classes ont des méthodes d'instance différentes.
Il s'agit du modèle d'usine, qui améliore la réutilisabilité de notre code et réduit le couplage entre les modules.
Le modèle d'usine, tout comme son nom, peut produire ce que l'on veut comme une usine, à condition de fournir des matières premières
Le modèle usine améliore la réutilisabilité de notre code et réduit le couplage entre modules
Le modèle usine est principalement utilisé pour créer le même type de différentes instances de objets
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!