introduire
Cet article présente principalement le modèle de création d'objets. L'utilisation de diverses techniques peut éviter considérablement les erreurs ou écrire du code très rationalisé.
Modèle 1: Espace de noms
Les espaces de noms peuvent réduire la quantité de dénomination globale requise pour éviter les conflits de dénomination ou l'excès. Généralement, lorsque nous définissons le niveau de l'objet, cela ressemble souvent à ceci:
La copie de code est la suivante:
var app = app || {};
app.modulea = app.modulea || {};
app.modulea.submodule = app.modulea.submodule || {};
app.modulea.submodule.methoda = function () {
console.log ("imprimer un");
};
app.modulea.submodule.methodb = function () {
console.log ("imprimer B");
};
S'il y a de nombreux niveaux, nous devons continuer comme celui-ci, ce qui est très déroutant. Le modèle de l'espace de noms existe pour résoudre ce problème. Regardons le code:
La copie de code est la suivante:
// Insécurité, il peut écraser les objets MyApp existants
var myApp = {};
// bien
if (typeof myApp === "Undefined") {
var myApp = {};
}
// une manière plus simple
var myApp = myApp || {};
// Définir les méthodes communes
MyApp.Namespace = fonction (ns_string) {
var parties = ns_string.split ('.'),
parent = myapp,
je;
// Par défaut, si le premier nœud est MyApp, il sera ignoré, comme myapp.modulea
if (parties [0] === "MyApp") {
parties = pièces.Slice (1);
}
for (i = 0; i <part.length; i + = 1) {
// Si la propriété n'existe pas, créez
if (typeof parent [parties [i]] === "Undefined") {
parent [parties [i]] = {};
}
parent = parent [pièces [i]];
}
retour parent;
};
Appeler le code est très simple:
La copie de code est la suivante:
// Après l'espace de noms, la valeur de retour peut être attribuée à une variable locale
var module2 = myApp.Namespace ('myApp.modules.module2');
console.log (module2 === myApp.modules.module2); // vrai
// sauter MyApp
MyApp.Namespace ('modules.module51');
// Nom très long
MyApp.namespace ('une fois.upon.a.time.there.was.this.long.neted.property');
Modèle 2: Définition des dépendances
Parfois, un module ou une fonction peut se référer à certains modules ou outils tiers. Il est préférable de définir ces modules dépendants au début afin qu'ils puissent être facilement remplacés à l'avenir.
La copie de code est la suivante:
var myFunction = function () {
// dépend des modules
var event = yahoo.util.event,
dom = yahoo.util.dom;
// L'événement des variables locales et DOM sont utilisés dans le code après d'autres fonctions
};
Modèle 3: propriétés privées et méthodes privées
JavaScript ne fournit pas de syntaxe spécifique pour prendre en charge les propriétés privées et les méthodes privées, mais nous pouvons la mettre en œuvre par le biais de fermetures, le code est le suivant:
La copie de code est la suivante:
fonction gadget () {
// objet privé
var name = 'iPod';
// Fonctions publiques
this.getName = function () {
nom de retour;
};
}
var Toy = new gadget ();
// Le nom n'est pas défini et est privé
Console.log (Toy.Name); // indéfini
// Nom d'accès de la méthode publique
console.log (Toy.GetName ()); // "iPod"
var myobj; // Attribuez des valeurs à MyOBJ via une fonction auto-exécutante
(fonction () {
// objet libre
var name = "mon, oh mon";
// implémenter la partie publique, donc il n'y a pas de var
myobj = {
// Méthode d'autorisation
getName: function () {
nom de retour;
}
};
} ());
Mode 4: Mode de révélation
Il s'agit également de cacher des méthodes privées, ce qui est quelque peu similaire au modèle de module dans "une compréhension approfondie de la série JavaScript (3): analyse complète des modèles de modules", mais ce n'est pas une méthode de retour, mais une variable est déclarée externe, puis attribuée par des méthodes publiques à la variable en interne. Le code est le suivant:
La copie de code est la suivante:
var myarray;
(fonction () {
var astr = "[Array d'objets]",
toString = object.prototype.tostring;
fonction isArray (a) {
return toString.Call (a) === astr;
}
Fonction Indexof (Haystack, Needle) {
var i = 0,
max = haystack.length;
pour (; i <max; i + = 1) {
if (haystack [i] === aiguille) {
retour i;
}
}
retour -1;
}
// grâce à la mission, tous les détails ci-dessus sont cachés
MyArray = {
ISArray: ISArray,
Indexof: index,
InArray: Indexof
};
} ());
// Code de test
console.log (MyArray.isArray ([1, 2])); // vrai
console.log (MyArray.isArray ({0: 1})); // FAUX
console.log (MyArray.Indexof (["a", "b", "z"], "z")); // 2
console.log (MyArray.inarray (["a", "b", "z"], "z")); // 2
MyArray.Indexof = null;
console.log (MyArray.inarray (["a", "b", "z"], "z")); // 2
Mode 5: Mode de chaîne
Le mode chaîne vous permet d'appeler une méthode d'objet en continu, tel que obj.add (1) .Remove (2) .delete (4) .add (2). L'idée de mise en œuvre est très simple, qui est de retourner cela tel quel. Le code est le suivant:
La copie de code est la suivante:
var obj = {
Valeur: 1,
incrément: function () {
this.value + = 1;
retourner ceci;
},
ajouter: fonction (v) {
this.value + = v;
retourner ceci;
},
shout: function () {
console.log (this.value);
}
};
// appel de méthode de chaîne
obj.increment (). add (3) .shout (); // 5
// peut également être appelé un par un
obj.increment ();
obj.add (3);
obj.shout ();
Résumer
Cet article est l'article précédent du mode de création d'objets, alors restez à l'écoute pour le prochain article demain.