Objets et prototypes en JavaScript (1)

Modèle d'usine

Nous savons que pour créer un objet nous pouvons utiliser le code suivant :

var user = new Object(); //使用new运算符创建一个对象
user.name = '念在三角湖畔'; //给对象添加属性
user.age = 22;
user.address = '湖北武汉';
alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'

Créer des objets de cette manière est relativement simple et intuitif, et il est également un type JavaScript. La manière la plus basique de créer des objets. Mais il y a un problème. Si nous devons créer plusieurs objets, je dois alors écrire beaucoup de code répété. Par exemple, si nous voulons créer un autre objet user1, nous devons réécrire le code ci-dessus. Cela n'est pas approprié dans le processus de développement réel. S'il y a trop d'objets, la quantité de code sera considérablement augmentée.

Afin de résoudre ce problème, nous pouvons utiliser une méthode appelée modèle d'usine. Cette méthode consiste à résoudre le problème de l'instanciation d'objets qui génère beaucoup de code en double.

function create(name, age) {
　　var obj = new Object(); 
　　obj.name = name; 
　　obj.age = age;
　　obj.run = function () {
　　　　return this.name +' '+ this.age;
　　};
　　return obj;
}
var obj1= create('ZXC', 10); //第一个实例
var obj2= create('CXZ', 20); //第二个实例
alert(obj1.run());
alert(obj1.run());

Nous pouvons voir à partir du code ci-dessus que le modèle d'usine résout le problème de la grande quantité de duplication de code lors de l'instanciation, mais un autre problème se pose, c'est-à-dire le problème d'identification, nous ne pouvons tout simplement pas comprendre quoi ils le sont. Quel objet est l’instance. Par exemple,

alert(typeof obj1); //Object
alert(obj1 instanceof Object); //true

Le code ci-dessus indique que box1 est un objet Object, mais nous ne pouvons pas savoir quel objet a été créé.

2. Constructeur (méthode constructeur)

Afin de résoudre le problème ci-dessus, nous pouvons utiliser la méthode constructeur pour créer des objets. La seule différence entre un constructeur et une fonction ordinaire réside dans la manière dont elle est appelée. Cependant, les constructeurs sont aussi des fonctions.

function User(name, age) { //构造函数模式
　　this.name = name;
　　this.age = age;
　　this.run = function () {
　　　　return this.name + ' '+this.age; 　　};
}

Utilisez simplement l'opérateur new lors de la création d'un objet :

var user1= new User('ZXC', 25);
var user2= new User('CXZ', 22);

Nous pouvons désormais détecter si user1 ou user2 appartient à User.

alert(user1 instanceof User);//true　

On peut voir que l'utilisation de la méthode constructeur résout non seulement le problème de l'instanciation répétée, mais résout également le problème de la reconnaissance d'objets .

Le processus d'utilisation du constructeur est le suivant :

1. Lorsque le nouveau constructeur () est exécuté, new Object() est exécuté en arrière-plan ; 🎜>

　2. Donnez la portée du constructeur au nouvel objet.

　3. Exécutez le code dans le constructeur

　4. Renvoyez le nouvel objet directement en arrière-plan.

Examinons ensuite les problèmes de fonction à l'intérieur du constructeur. Si nous exécutons l'instruction suivante :

alert(user1.run==user2.run);//结果返回的是false

, le résultat est faux, ce qui signifie que la méthode est en fait une adresse de référence. Si nous créons plusieurs objets à plusieurs reprises, les méthodes de chaque objet ouvriront un nouvel espace dans la mémoire, ce qui gaspillera plus d'espace. Pour résoudre ce problème, nous devons utiliser le partage d'attributs ou de méthodes d'instance. Nous continuerons à discuter de la résolution de ce problème dans le prochain article.

Ce qui précède est le contenu des objets et des prototypes en JavaScript (1). Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !