Inheritance de classe en Javascript

Question

Je me demande comment simuler Class Inheritance en JavaScript. Je sais que la classe ne s'applique pas à JavaScript, la façon dont nous utilisons les fonctions pour créer des objets et faire les choses d'héritage à travers l'objet Prototype.

Par exemple, comment voulez-vous convertir cette structure en JavaScript:

public class Mankind { 
    public string name; 
    public string lastname; 
} 

public class Person: Mankind { 
    public void Run(string fromWhat) { 
     //write the run logic 
    } 
} 

Quel est l'équivalent de ce morceau de code JavaScript.

Edit:

J'ai aussi trouvé un autre lien où Douglas Crockford explique différents modèles d'héritage comme CMS fait: Classical Inheritance in JavaScript.

Espérons que cela aide aussi les autres.

Answer 1

Il y a plusieurs façons beaucoup de mettre en œuvre l'héritage et la réutilisation des comportements JavaScript, peut-être la manière qui est plus proche de votre base de classe POO exemple serait le pseudo- héritage classique:

function Mankind (name, lastname) { 
    this.name = name; 
    this.lastname = lastname; 
} 

function Person (name, lastname) { 
    this.name = name; 
    this.lastname = lastname; 

    this.run = function() { 
    // run logic 
    }; 
} 
Person.prototype = new Mankind(); 
Person.prototype.walk = function() { 
    // walk logic 
}; 

la différence entre run et walk est que le premier existera sur tous les o bject instance de Person, et la seconde méthode, walk, existera seulement dans Person.prototype et sera accessible à travers la chaîne du prototype.

Dans ce modèle, vous voyez un peu de duplication de code, nous avons besoin de la logique pour initialiser les champs aussi sur le constructeur hérité, un autre motif qui évite cela, est Constructor application Fonction:

function Mankind (name, lastname) { 
    this.name = name; 
    this.lastname = lastname; 
} 

function Person (name, lastname) { 
    Mankind.apply(this, arguments); 
    this.run = function() { 
    // run logic 
    }; 
} 

Plus d'infos:

• How to inherit from a class in JavaScript (divers exemples)
• Inheritance Patterns in JavaScript (article)
• Classical Inheritance in JavaScript (article)

Answer 2

check out MooTools

http://mootools.net/docs/core/Class/Class

Answer 3

(function(){ 
function Mankind() { 
    this.name = "joe"; 
} 
function Person(){ 
    this.Run = function(fromWhat){ 
     alert(this.name + ' runs from ' + fromWhat + '!'); 
    } 
} 
Person.prototype = new Mankind; 

var dude = new Person; 
dude.Run('bear'); 
})() 

Au lieu d'utiliser la structure de données statique des définitions (classe de type), javascript utilise des fonctions de construire dynamiquement des prototypes de structure de données. C'est un grand saut car cela vous permet de construire une structure en rassemblant suffisamment de contexte pour savoir ce dont vous avez réellement besoin. La chaîne de prototypes est également dynamique, ce qui constitue un autre grand pas en avant et je commence tout juste à en faire le tour.

Au lieu de plusieurs mots, vérifiez la source suivante Luc:

(function(){ 
// prototype chaining example 
function f1(){this.foo = "foo"} 
function f2(){this.bar = "bar"} 
function f3(){this.bat = "bat"} 
f2.prototype = new f1(); 
f3.prototype = new f2(); 
var a = new f1; 
var b = new f2; 
var c = new f3; 
// state is inherited 
var member_list = [ 
a.foo, // "foo" 
a.bar, // undefined 
a.bat, // undefined 
b.foo, // "foo" 
b.bar, // "bar" 
b.bat, // undefined 
c.foo, // "foo" 
c.bar, // "bar" 
c.bat // "bat" 
]; 
// prototypes are chained 
var instanceof_list = [ 
a instanceof f1, // true 
a instanceof f2, // false 
a instanceof f3, // false 
b instanceof f1, // true 
b instanceof f2, // true 
b instanceof f3, // false 
c instanceof f1, // true 
c instanceof f2, // true 
c instanceof f3 // true 
]; 

// try to break chain 
function f4(){this.fu = "fu"} 
f2.prototype = new f4; 

// state is preserved 
var member_list2 = [ 
a.foo, // "foo" 
a.bar, // undefined 
a.bat, // undefined 
b.foo, // "foo" 
b.bar, // "bar" 
b.bat, // undefined 
c.foo, // "foo" 
c.bar, // "bar" 
c.bat // "bat" 
]; 
// chain not broken, but link is removed 
var instanceof_list2 = [ 
a instanceof f1, // true 
a instanceof f2, // false 
a instanceof f3, // false 
b instanceof f1, // true 
b instanceof f2, // false 
b instanceof f3, // false 
c instanceof f1, // true 
c instanceof f2, // false 
c instanceof f3 // true 
]; 
// no new link is added 
var instanceof_list3 = [ 
a instanceof f4, // false 
b instanceof f4, // false 
c instanceof f4 // false 
]; 
debugger  
})()