Constructeur JS et fonction prototype

Si la méthode est créée, elle ne doit pas être créée à l'intérieur du constructeur; à la place, elle doit être créée à l'extérieur et appelée à l'intérieur du constructeur, ce qui économisera beaucoup d'espace.
Exemple d'explication:
Question: Créez un constructeur Persion et ajoutez la méthode sayName à chaque objet

Si elle est créée à l'intérieur du constructeur (comme dans l'exemple 1), une nouvelle méthode sayName sera créée chaque fois que le constructeur est exécuté. Ceci est complètement inutile, et ils peuvent partager la même méthode (comme dans l'exemple 2).

//例1:修改前
function Persion(name, age, gender) {
    
    
	this.name = name;
	this.age = age;
	this.gender = gender;
	//向对象中添加一个方法
	this.sayName = function(){
    
    
		alert("Hello,我是:",this.name);
	};
}

//创建一个Persion的实例
var per = new Persion("孙悟空",18,"男");
var per2 = new Persion("猪八戒",19,"男");

console.log(per.sayName == per2.sayName);//返回结果是false
//例2:修改后
function Persion(name, age, gender) {
    
    
	this.name = name;
	this.age = age;
	this.gender = gender;
	//向对象中添加一个方法
	this.sayName = fun;
}

//将sayName方法在全局作用域中定义
function fun(){
    
    
		alert("Hello,我是:",this.name);
	};

//创建一个Persion的实例
var per = new Persion("孙悟空",18,"男");
var per2 = new Persion("猪八戒",19,"男");

console.log(per.sayName == per2.sayName);//返回结果是ture

Cependant, si la fonction est définie dans la portée globale, il y aura de nouveaux problèmes: elle
pollue l'espace de noms de la portée globale, et ce n'est pas sûr

Solution: utiliser des objets prototypes

Pour chaque fonction que nous créons, l'analyseur ajoutera une propriété prototype à la fonction, cette propriété correspond à un objet, cet objet est ce que nous appelons l'objet prototype

Si la fonction est appelée comme une fonction normale, le prototype n'a aucun effet

Lorsqu'une fonction est appelée sous la forme d'un constructeur, il y aura un attribut implicite dans l'objet qu'elle crée qui pointe vers l'objet prototype du constructeur. On peut accéder à l'attribut via __proto__ (deux traits de soulignement avant et après)

L'objet prototype est équivalent à une zone publique. Toutes les instances de la même classe peuvent accéder à cet objet prototype. Nous pouvons définir le contenu commun de l'objet dans l'objet prototype.

Ajouter une syntaxe:

//添加属性
构造函数名.prototype.属性 = 属性值;

//添加方法
构造函数名.prototype.方法 = function(){
    
    
							语句;
						};

Séquence d'accès:
lorsque nous accédons aux propriétés ou aux méthodes d'un objet, il cherchera d'abord dans l'objet lui-même, s'il y en a, puis l'utilisera directement;
sinon, il cherchera dans l'objet prototype, s'il le trouve, utilisez-le directement

function  MyClass() {
    
    

}

//向MyClass的原型对象中添加属性a
MyClass.prototype.a = 123;

//向MyClass的原型对象中添加一个方法
MyClass.prototype.sayHello = function() {
    
    
	alert("Hello");
};

var mc = new MyClass();

console.log(mc.__proto__ == MyClass.prototype); //true

Lorsque vous utilisez in pour vérifier si un objet contient une certaine propriété, s'il n'y en a pas dans l'objet mais qu'il y en a dans le prototype, il retournera également true

Utilisez la méthode hasOwnProperty () de l'objet pour vérifier si l'objet lui-même contient la propriété et ne renvoyez true que si l'objet lui-même contient

La méthode hasOwnProperty () est dans le prototype du prototype.

Le prototype de l'objet Object n'a pas de prototype, s'il n'est toujours pas trouvé dans l'Object, il retournera undefined

Vous pouvez modifier la méthode toString

function  MyClass() {
    
    

   }
MyClass.prototype.name = "原型中的名字";

var mc = new MyClass();
console.log("name" in mc);//true
console.log(mc.hasOwnProperty("name"));//false

//修改MyClass原型的toString 方法
MyClass.prototype.toString = function() {
    
    
	return "MyClass类的toString方法已被修改";
};

Je suppose que tu aimes

Origine blog.csdn.net/qq_42524288/article/details/103099158
conseillé
Classement