Héritage et autres héritages dans les astuces JavaScript

Héritage et autres héritages dans les astuces JavaScript_javascript

PHP中文网

Libérer： 2016-05-16 15:02:53

original

1683 Les gens l'ont consulté

Introduction à l'héritage

L'héritage en JS est un sujet très complexe, bien plus complexe que l'héritage dans tout autre langage orienté objet. Dans la plupart des autres langages orientés objet, hériter d’une classe ne nécessite qu’un seul mot-clé. Afin d’atteindre l’objectif d’hériter des membres publics de JS, une série de mesures doivent être prises. JS appartient à l'héritage prototypique. Grâce à cette flexibilité, nous pouvons utiliser soit un héritage prototypique basé sur les classes, soit un héritage prototypique plus subtil. Il devrait être clair dans JS que tout héritage se fait via un prototype et que JS hérite en fonction des objets.

Hérité :

function Animal(name){ 
this.name = name; 
this.showName = function(){ 
alert(this.name); 
} 
} 
function Cat(name){ 
Animal.call(this, name); 
} 
var cat = new Cat("Black Cat"); 
cat.showName();

Copier après la connexion

Animal.call(this) signifie Si vous utilisez l'objet Animal à la place de cet objet, alors Cat a toutes les propriétés et méthodes d'Animal. L'objet Cat peut appeler directement les méthodes et propriétés d'Animal.

Héritage multiple : <🎜. >

function Class10() 
{ 
this.showSub = function(a,b) 
{ 
alert(a-b); 
} 
} 
function Class11() 
{ 
this.showAdd = function(a,b) 
{ 
alert(a+b); 
} 
} 
function Class2() 
{ 
Class10.call(this); 
Class11.call(this); 
}

Copier après la connexion

C'est très simple, utiliser deux appels pour obtenir un héritage multiple

Bien sûr, l'héritage js Il existe d'autres méthodes, telles que l'utilisation de la chaîne de prototypes. Cela n'entre pas dans le cadre de cet article. J'explique simplement l'utilisation de call ici. En parlant d'appel, et bien sûr d'appliquer, ces deux méthodes signifient fondamentalement la même chose. La différence est que le deuxième paramètre de call peut être de n'importe quel type, tandis que le deuxième paramètre de apply doit être un tableau ou des arguments.

Laissez-moi vous présenter comment implémenter l'héritage simple en JavaScript ?

L'exemple suivant créera une classe d'employé Employee, qui hérite de toutes les propriétés du prototype prototype de Person.

function Employee(name, sex, employeeID) {
this.name = name;
this.sex = sex;
this.employeeID = employeeID;
}
// 将Employee的原型指向Person的一个实例
// 因为Person的实例可以调用Person原型中的方法, 所以Employee的实例也可以调用Person原型中的所有属性。
Employee.prototype = new Person();
Employee.prototype.getEmployeeID = function() {
return this.employeeID;
};
var zhang = new Employee("ZhangSan", "man", "");
console.log(zhang.getName()); // "ZhangSan

Copier après la connexion

La mise en œuvre ci-dessus de l'héritage est très approximative et il existe de nombreux problèmes :

Lors de la création du constructeur et du prototype Employee (ci-après appelée classe), Person est instanciée, ce qui est inapproprié.

Le constructeur de Employee ne peut pas appeler le constructeur de la classe parent Person, ce qui entraîne l'affectation répétée des attributs nom et sexe dans le constructeur Employee.

La fonction dans Employee écrasera la fonction du même nom dans Person, et il n'y a pas de mécanisme de surcharge (c'est le même type de problème que le précédent).

La syntaxe de création de classes JavaScript est trop fragmentée et pas aussi élégante que la syntaxe en C#/Java.

Il y a une erreur de pointage dans l'attribut constructeur dans l'implémentation.

Ce qui précède est le contenu de l'héritage en JavaScript et d'autres techniques d'héritage_javascript. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (m.sbmmt.com) !