JavaScript orienté objet - création d'objets à l'aide de méthodes d'usine et de méthodes de constructeur

Dans l'article précédent, nous avons présenté la méthode de création d'objets JavaScript simples.Le plus gros problème des objets js simples est qu'il n'y a pas de contrainte de classe, donc la réutilisation des objets ne peut pas être réalisée, et il n'y a pas de convention qui sera mis en service pendant l'exploitation. Venez vous interroger. Les gens ont donc emprunté un modèle d'usine à des modèles de conception pour créer des objets JavaScript.

Utiliser les méthodes d'usine pour créer des objets JavaScript

L'idée de la méthode d'usine est de créer un objet dans une fonction, puis de définir les propriétés et méthodes correspondantes pour l'objet, et enfin de retourner l'objet. Encapsulez via des fonctions pour créer des objets avec des interfaces spécifiques. Voici un exemple d'utilisation de la méthode factory pour créer un objet personne :

function createPerson(name,age){
  var o = new Object();
  o.name = name;
  o.age = age;
  o.say = function(){
    alert(this.name + "," + this.age);
  }
  return o;
}
// 实例化p1和p2对象
var p1 = createPerson("Leon",22);
var p2 = createPerson("Ada",20);
 
//调用p1和p2对象的say()方法
p1.say();
p2.say();

Bien que l'utilisation de la méthode factory résolve efficacement le problème de classe, il existe encore un autre problème. Nous ne pouvons pas détecter le type de données des objets p1 et p2. Nous ne pouvons utiliser typeof que pour détecter que l'objet est un type d'objet :

console.info(typeof p1);  // 控制台输出：Object

Si nous voulons utiliser instanceof pour déterminer le type de l'objet, alors p1 instanceof ?, quel type doit être renseigné après instance de ? Nous ne le savons pas.

Utilisez des constructeurs pour créer des objets JavaScript

Étant donné que la méthode d'usine ne peut pas déterminer le type spécifique de l'objet, les gens ont proposé une nouvelle méthode de création d'objets JavaScript - la méthode constructeur. En JavaScript, les constructeurs peuvent être utilisés pour créer des types spécifiques d'objets, tels que Object et Array. Ces constructeurs natifs js apparaîtront automatiquement dans l'environnement d'exécution au moment de l'exécution. Nous pouvons également personnaliser le constructeur pour définir les propriétés et les méthodes des types personnalisés.

La méthode d'utilisation d'un constructeur pour créer une classe est similaire à la méthode de création d'une classe basée sur une usine. La plus grande différence est que le nom de la fonction est le nom de la classe. Habituellement, selon la convention des normes de programmation, la première lettre d'une classe est en majuscule. Lorsque vous utilisez un constructeur pour créer une classe, la définition de l'attribut est complétée via le mot-clé this à l'intérieur de la fonction.

// 使用构造函数方式来创建Person类
function Person(name,age){
  this.name = name;
  this.age = age;
  this.say = function(){
    console.info(this.name + "," + this.age);
  }
}
// 通过new关键字来创建对象
var p1 = new Person("Leon",22);
var p2 = new Person("Ada",20);
// 调用对象的方法
p1.say();
p1.say();

Comme le montre le code ci-dessus, après avoir terminé la création de la classe, nous pouvons instancier l'objet via le nouveau mot-clé.

L'utilisation de la méthode constructeur résout très bien le problème de détection du type d'objet. Nous pouvons utiliser le mot-clé instanceof pour déterminer si l'objet est de type Personne :

console.info(p1 instanceof Person);   //控制台显示：true                              
console.info(p2 instanceof Person);   //控制台显示：true

De plus, nous peut également utiliser le mot-clé constructor pour vérifier si le constructeur de l'objet est de type Personne :

console.info(p1.constructor == Person);   //控制台显示：true                              
console.info(p2.constructor == Person);   //控制台显示：true

Ou imprimer directement les constructeurs de p1 et p2 pour comparaison :

console.info(p1.constructor);
console.info(p2.constructor);

Le problème que nous pose l'utilisation de la méthode constructeur est qu'il y aura une copie de la méthode dans chaque objet. Si l'objet a plusieurs méthodes, il occupera beaucoup d'espace mémoire.

Dans certains langages de programmation orientés objet compilés avancés (tels que Java), les méthodes objet sont générées dynamiquement dans la zone de pile au moment de l'exécution et n'occupent pas de mémoire. En Javascript, pour les objets créés à l'aide de la méthode constructeur, chaque méthode de l'objet est une copie de la méthode de classe. S'il y a un grand nombre de méthodes dans l'objet, elle occupera beaucoup d'espace mémoire.

Nous pouvons définir les méthodes de classe dans des variables globales, afin que les méthodes de la classe puissent pointer vers la même fonction. Le code est le suivant :

// 使用构造函数方式来创建Person类
function Person(name,age){
  this.name = name;
  this.age = age;
  // 此时的类方法是一个全局方法的引用
  this.say = say;
}
//将方法设置为全局的方法
function say(){
  alert(this.name + "," + this.age);
}

En définissant la méthode de classe comme méthode globale, le problème des méthodes dans l'objet occupant de l'espace mémoire peut être résolu à ce stade, les méthodes dans tous les objets créés via. le constructeur pointe vers la même fonction globale A.

Mais si toutes les méthodes sont définies comme fonctions globales, ces fonctions peuvent être appelées par la fenêtre, ce qui détruit l'encapsulation de l'objet, et si un objet a un grand nombre de méthodes, cela provoquera du code. il contient un grand nombre de fonctions globales, ce qui n'est pas propice à notre développement.

Afin de résoudre ces lacunes de la méthode constructeur, nous devons utiliser des prototypes pour créer des objets. Dans le prochain article, nous présenterons l'utilisation de prototypes pour créer des objets JavaScript.

Ce qui précède est orienté objet JavaScript - utilisant des méthodes d'usine et des méthodes de constructeur pour créer des objets. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !