Klassenvererbung in Javascript

Question

Ich frage mich, wie man die Klassenvererbung in JavaScript simulieren kann. Ich weiß, Klasse gilt nicht für JavaScript, die Art, wie wir verwenden, ist Funktionen, um Objekte zu erstellen und tun die Vererbung Dinge durch Prototype Objekt.

Wie konvertiert man zum Beispiel diese Struktur in JavaScript :

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

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

Was ist die Entsprechung dieses Codes in JavaScript?

Bearbeiten:

Ich habe auch einen anderen Link gefunden, in dem Douglas Crockford verschiedene Vererbungsmodelle wie folgt erklärt CMS tut: Klassische Vererbung in JavaScript .

Ich hoffe, es hilft auch anderen.

Answer 1

Es gibt viele Möglichkeiten, Vererbung und Verhaltenswiederverwendung in JavaScript zu implementieren, vielleicht ist der Weg, der Ihrem klassenbasiert Ein Beispiel für OOP wäre die pseudo-klassische Vererbung:

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
};

Der Unterschied zwischen run y walk ist, dass der erste in jeder Objektinstanz von Person und die zweite Methode, walk gibt es nur in Person.prototype und wird über die Prototypenkette zugänglich sein.

In diesem Muster sehen Sie ein bisschen Code-Duplizierung, wir brauchen die Logik, um die Felder auch auf dem geerbten Konstruktor zu initialisieren, ein anderes Muster, das dies vermeidet, ist Constructor Function Anwendung:

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

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

Mehr Informationen:

• Wie man von einer Klasse in JavaScript erbt (verschiedene Beispiele)
• Vererbungsmuster in JavaScript (Artikel)
• Klassische Vererbung in JavaScript (Artikel)

Answer 2

Aktualisiert für ES 6:

class Mankind {
    constructor (lastName, firstName) {
      this.lastName = lastName;
      this.firstName = firstName;
    }
}

class Person extends Mankind {
    run (fromWhat) {
        //write the run logic
    }
}

Answer 3

MooTools ausprobieren

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

Answer 4

(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');
})()

Anstatt statische Datenstrukturdefinitionen (Klassentyp) zu verwenden, verwendet Javascript Funktionen, um dynamisch Datenstrukturprototypen zu erstellen. Das ist ein großer Sprung, weil es Ihnen erlaubt, eine Struktur zu bauen, wie Sie sammeln genug Kontext zu wissen, was Sie wirklich brauchen. Die Prototypenkette ist ebenfalls dynamisch, was ein weiterer großer Sprung ist, und ich fange gerade erst an, mir darüber klar zu werden.

Anstelle von mehr Worten, schauen Sie sich die folgende Quelle an: Luke:

(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    
})()