introduire
Tout le monde connaît les constructeurs, mais si vous êtes novice, il est toujours nécessaire de comprendre ce que sont les constructeurs. Le constructeur est utilisé pour créer un type d'objet spécifique - déclare non seulement l'objet utilisé, mais accepte également les paramètres pour définir la valeur du membre de l'objet lorsque l'objet est créé pour la première fois. Vous pouvez personnaliser votre propre constructeur et déclarer les propriétés ou les méthodes de l'objet de type personnalisé.
Utilisation de base
Dans JavaScript, les constructeurs sont généralement considérés comme utilisés pour implémenter des instances. JavaScript n'a pas le concept de classes, mais dispose de constructeurs spéciaux. Utilisez le nouveau mot-clé pour appeler la fonction précoce définie. Vous pouvez dire à JavaScript que vous souhaitez créer un nouvel objet et que les déclarations des membres du nouvel objet sont définies dans le constructeur. À l'intérieur du constructeur, ce mot-clé fait référence à l'objet nouvellement créé. L'utilisation de base est la suivante:
La copie de code est la suivante:
voiture de fonction (modèle, année, miles) {
this.model = modèle;
this.year = an;
this.miles = miles;
this.output = function () {
retourne this.model + "Left" + this.miles + "km";
};
}
var tom = new Car ("oncle", 2009, 20000);
var dudu = new Car ("Dudu", 2010, 5000);
console.log (tom.output ());
console.log (dudu.output ());
L'exemple ci-dessus est un modèle de constructeur très simple, mais c'est un peu un problème. Tout d'abord, il est très difficile d'utiliser l'héritage. Deuxièmement, la sortie () est redéfinie chaque fois qu'un objet est créé. La meilleure façon est de permettre à tous les instances de type de voiture de partager cette méthode de sortie (), de sorte que s'il y a de grands lots d'instances, cela économisera beaucoup de mémoire.
Pour résoudre ce problème, nous pouvons utiliser la méthode suivante:
La copie de code est la suivante:
voiture de fonction (modèle, année, miles) {
this.model = modèle;
this.year = an;
this.miles = miles;
this.output = formatcar;
}
Fonction FormatCar () {
retourne this.model + "Left" + this.miles + "km";
}
Bien que cette méthode soit disponible, nous avons la meilleure méthode suivante.
Constructeurs et prototypes
Il existe une propriété prototype dans JavaScript appelé prototype. Lorsque le constructeur est appelé pour créer un objet, toutes les propriétés du prototype du constructeur sont disponibles sur l'objet nouvellement créé. De cette façon, plusieurs instances d'objets de voiture peuvent partager le même prototype. Élargissons le code dans l'exemple ci-dessus:
La copie de code est la suivante:
voiture de fonction (modèle, année, miles) {
this.model = modèle;
this.year = an;
this.miles = miles;
}
/ *
Remarque: Ici, nous avons utilisé l'objet.prototype. Nom de la méthode, pas l'objet.prototype
Il est principalement utilisé pour éviter de réécrire l'objet prototype prototype
* /
Car.prototype.output = function () {
retourne this.model + "Left" + this.miles + "km";
};
var tom = new Car ("oncle", 2009, 20000);
var dudu = new Car ("Dudu", 2010, 5000);
console.log (tom.output ());
console.log (dudu.output ());
Ici, une instance unique () peut être partagée et utilisée dans toutes les instances d'objet de voiture.
Aussi: Nous recommandons aux constructeurs de commencer par des lettres majuscules pour distinguer les fonctions ordinaires.
Pouvez-vous seulement utiliser de nouveau?
Dans l'exemple ci-dessus, la voiture de fonction est créée à l'aide d'un nouveau pour créer des objets. N'y a-t-il qu'une seule façon? En fait, il existe d'autres façons, énumérons deux:
La copie de code est la suivante:
voiture de fonction (modèle, année, miles) {
this.model = modèle;
this.year = an;
this.miles = miles;
// Personnaliser une sortie de sortie
this.output = function () {
retourne this.model + "Left" + this.miles + "km";
}
}
// Méthode 1: appelée en fonction
Voiture ("oncle", 2009, 20000); // Ajouter à l'objet Window
console.log (window.output ());
// Méthode 2: Appelez dans le cadre d'un autre objet
var o = nouvel objet ();
Car.Call (O, "Dudu", 2010, 5000);
console.log (o.output ());
La méthode 1 de ce code est un peu spéciale. Si nouveau appelle directement la fonction, cela pointe vers la fenêtre globale de l'objet. Vérifions-le:
La copie de code est la suivante:
// comme appel de fonction
var tom = car ("oncle", 2009, 20000);
console.log (typeof tom); // non défini "
console.log (window.output ()); // "Oncle a marché 20 000 kilomètres"
À l'heure actuelle, l'objet Tom n'est pas défini et Window.output () sortira correctement le résultat. Si vous utilisez le nouveau mot-clé, il n'y a pas de tel problème. La vérification est la suivante:
La copie de code est la suivante:
// utilise un nouveau mot-clé
var tom = new Car ("oncle", 2009, 20000);
console.log (typeof tom); // "objet"
console.log (tom.output ()); // "Oncle a marché 20 000 kilomètres"
Forcer nouveau
L'exemple ci-dessus montre le problème de ne pas utiliser de nouveau. Y a-t-il donc un moyen pour le constructeur de forcer le nouveau mot-clé? La réponse est oui, au-dessus du code:
La copie de code est la suivante:
voiture de fonction (modèle, année, miles) {
if (! (Cette instance de voiture)) {
Retourner une nouvelle voiture (modèle, année, miles);
}
this.model = modèle;
this.year = an;
this.miles = miles;
this.output = function () {
retourne this.model + "Left" + this.miles + "km";
}
}
var tom = new Car ("oncle", 2009, 20000);
var dudu = car ("dudu", 2010, 5000);
console.log (typeof tom); // "objet"
console.log (tom.output ()); // "Oncle a marché 20 000 kilomètres"
console.log (typeof dudu); // "objet"
console.log (dudu.output ()); // "Dudu a marché 5000 kilomètres"
En jugeant si cette instance est une voiture, nous décidons de retourner une nouvelle voiture ou de continuer à exécuter le code. Si le nouveau mot-clé est utilisé, (cette instance de voiture) est vraie et l'affectation de paramètres suivante se poursuivra. Si nouveau n'est pas utilisé, (cette instance de voiture) est fausse et une nouvelle instance sera à nouveau renvoyée.
Fonction d'emballage originale
Il y a 3 fonctions de wrapper originales dans JavaScript: numéro, chaîne, booléen, parfois les deux sont utilisés:
La copie de code est la suivante:
// Utiliser la fonction d'emballage originale
var s = new String ("ma chaîne");
var n = nouveau nombre (101);
var b = new boolean (true);
// recommande ceci
var s = "ma chaîne";
var n = 101;
var b = true;
Recommandé, n'utilisez ces fonctions de wrapper que lorsque vous souhaitez préserver l'état numérique. Pour la différence, vous pouvez vous référer au code suivant:
La copie de code est la suivante:
// chaîne originale
var salut = "bonjour";
// utilise la méthode Split () pour diviser
saluer.split ('') [0]; // "Bonjour"
// ajouter de nouveaux attributs au type d'origine ne rapportera pas d'erreur
saluer.smile = true;
// Cette valeur ne peut pas être obtenue (nous avons expliqué pourquoi dans le chapitre 18 implémentation ECMAScript)
Console.log (typeof Greall.smile); // non défini "
// chaîne originale
var accorde = new String ("Hello là");
// utilise la méthode Split () pour diviser
saluer.split ('') [0]; // "Bonjour"
// ajouter de nouveaux attributs au type de fonction de wrapper ne signalera pas une erreur
saluer.smile = true;
// Les nouvelles propriétés sont accessibles normalement
Console.log (typeof Greall.smile); // "booléen"
Résumer
Ce chapitre explique principalement les différences entre l'utilisation du mode constructeur, la méthode d'appel et le nouveau mot-clé. J'espère que tout le monde y fera attention lorsque vous l'utilisez.
Référence: http://www.addyosmani.com/resources/essidentialjsdesignpatterns/book/#constructorpatternjavascript