Wie kann ich "Klassen" in JavaScript emulieren? (mit oder ohne Drittanbieterbibliothek)

Question

Wie kann ich Klassen (und Namespaces) in JavaScript emulieren?

Ich muss eine JavaScript-Bibliothek erstellen und habe begrenzte Erfahrung mit der Sprache. Ich dachte immer, dass es native Unterstützung für Klassen hat, aber es ist weniger mit Java verwandt als ich angenommen hatte. Es scheint, dass alles in JavaScript eine Funktion ist.

Was ich bis jetzt herausgefunden habe, macht sehr viel Sinn, da es eine dynamische, schwach typisierte Sprache ist, aber das macht es zu einer Abkehr für Leute, die es gewohnt sind eine stark typisierte Sprache zu haben und einen Compiler zu benutzen Finde unsere Fehler :)

Ich arbeite hauptsächlich in C# und Java und hoffte auf etwas syntaktisch ähnliches, so dass die Bibliothek für unsere anderen C# -Entwickler, die sie pflegen müssen, bekannt ist.

Ich habe die folgende Art von Code, der funktioniert, aber ich fragte mich, was andere Entwickler nehmen würde auf diesem sein. Was sind die Alternativen? Gibt es einen Weg, der besser ist? Gibt es einen Weg, der lesbarer ist?

Ich verstehe, dass das, was ich will, ist etwas Ähnliches wie C# oder Java, wenn ich soll nur die Tatsache akzeptieren, dass diese JavaScript ist, aber mein Ziel ist es, zu versuchen, die Lernkurve für andere Entwickler zu erleichtern, indem es besser vertraut und intuitiv für sie.

//Perform the namespace setup (this will actually be done with checking 
//in real life so we don't overwrite definitions, but this is kept short 
//for the code sample). 
var DoctaJonez = new function(); 
DoctaJonez.Namespace1 = new function(); 

/** 
* Class description. 
*/ 
DoctaJonez.Namespace1.SomeClass = function() 
{ 
    /** 
    * Public functions listed at the top to act like a "header". 
    */ 
    this.publicFunction = privateFunction; 

    /** 
    * Private variables next. 
    */ 
    var privateVariable; 

    /** 
    * Finally private functions. 
    */ 
    function privateFunction() 
    { 

    } 
} 

//Create an instance of the class 
var myClass = new DoctaJonez.SomeClass(); 

//Do some stuff with the instance 
myClass.publicFunction(); 

Answer 1

• 3 ways to define a JavaScript class
• Object-oriented JavaScript
• JavaScript Tutorial: Functions and Classes

Answer 2

Zum Beispiel in http://mckoss.com/jscript/object.htm.

Sie finden eine Reihe von Beispielen, wenn Sie nach "JavaScript objektorientiert" suchen. Wenn Sie sich bekannte JavaScript-Frameworks wie Ext JS ansehen, erhalten Sie ein Gefühl für diese Konzepte und deren praktische Anwendung.

Answer 3

Mepcotterell bietet gute Links, aber ich möchte hinzufügen, dass ich persönlich Namespaces als Objekte sehen möchte, d. H. DoctaJonez.Namespace1 = {};.

Answer 4

Für allgemeines Verständnis der OOP in JavaScript können Sie nicht besser als Douglas Crockford lesen:

• Classical Inheritance in JavaScript
• Prototypal Inheritance in JavaScript
• Private Members in JavaScript

Für Dojo Fans (und für allgemeine Techniken) Neil Roberts hat gute Artikel:

• Color by numbers: dojo.delegate
• JavaScript Metaclass Programming

Plain Vanilla dojo.declare() ist wahrscheinlich die am weitesten fortgeschrittenen OOP Stiftung in den Mainstream-Bibliotheken um. Ich bin voreingenommen, aber akzeptiere mein Wort dafür nicht.Hier finden Sie Beispiele, wie Sie es verwenden können.

Ein einfaches Objekt Vanille:

// Let's define a super simple class (doesn't inherit anything). 
dojo.declare("Person", null, { 
    // Class-level property 
    answer: 42, 

    // Class-level object property 
    name: {first: "Ford", last: "Prefect"}, 

    // The constructor, duh! 
    constructor: function(age){ 
    this.age = age; // instance-level property 
    }, 

    // A method 
    saySomething: function(verb){ 
    console.log("I " + verb + " " + 
     this.name.first + " " + this.name.last + "!" + 
     " -- " + this.answer); 
    }, 

    // Another method 
    passportControl: function(){ 
    console.log("I am " + this.age); 
    } 
}); 

Beispiel:

// A fan of Ford Perfect 
var fan = new Person(18); 
fan.saySomething("love"); // I love Ford Perfect! -- 42 
fan.passportControl(); // I am 18 

Einfachvererbung ist einfach:

// Let's create a derived class inheriting Person 
dojo.declare("SuperAgent", Person, { 
    // Redefine class-level property 
    answer: "shaken, not stirred", 

    // Redefine class-level object property 
    name: {first: "James", last: "Bond"}, 

    // The constructor 
    constructor: function(age, drink){ 
    // We don't need to call the super class because 
    // it would be done automatically for us passing 
    // all arguments to it. 

    // At this point "age" is already assigned. 

    this.drink = drink; // Instance-level property 
    }, 

    // Let's redefine the method 
    saySomething: function(verb){ 
    // Let's call the super class first 
    this.inherited(arguments); 
    // Pay attention: no need for extra parameters, or any extra code, 
    // we don't even name the class we call --- it is all automatic. 
    // We can call it any time in the body of redefined method 

    console.log("Yeah, baby!"); 
    }, 

    shoot: function(){ console.log("BAM!!!"); } 
}); 

Beispiel:

// Let's create a James Bond-wannabe 
var jb007 = new SuperAgent(45, "Martini"); 
jb007.saySomething("dig"); // I dig James Bond! -- shaken, not stirred 
          // Yeah, baby! 
jb007.passportControl(); // I am 45 
jb007.shoot();    // BAM!!! 

// Constructors were called in this order: Person, SuperAgent 
// saySomething() came from SuperAgent, which called Person 
// passportControl() came from Person 
// shoot() came from SuperAgent. 

Mixins:

// Let's define one more super simple class 
dojo.define("SharpShooter", null, { 
    // For simplicity no constructor 

    // One method to clash with SuperAgent 
    shoot: function(){ 
    console.log("It's jammed! Shoot!"); 
    } 
}); 

Mixin-basierte Mehrfachvererbung:

// Multiple inheritance 
dojo.declare("FakeAgent", ["SuperAgent", "SharpShooter"], { 
    // Let's do it with no constructor 

    // Redefine the method 
    saySomething: function(verb){ 
    // We don't call super here --- a complete redefinition 

    console.log("What is " + verb "? I want my " + this.drink + "!"); 
    }, 
}); 

Beispiel:

// A fake agent coming up 
var ap = new FakeAgent(40, "Kool-Aid"); 
ap.saySomething("hate"); // What is hate? I want my Kool-Aid! 
ap.passportControl(); // I am 40 
ap.shoot();    // It's jammed! Shoot! 

// Constructors were called in this order: Person, SuperAgent 
// saySomething() came from FakeAgent 
// passportControl() came from Person 
// shoot() came from SharpShooter. 

Wie Sie sehen können, dojo.declare() alle Notwendigkeiten mit einem einfachen gibt zu verwenden API: direkte Einzelvererbung, Mixin-basierte Mehrfachvererbung, automatische Verkettung von Konstruktoren und einfache Supermethoden.

Answer 5

Siehe Mozilla Developer Network (MDC) Artikel Class-Based vs. Prototype-Based Languages.

Answer 6

Mit MooTools. Siehe den Artikel How to write a Mootools Class.

Answer 7

Wenn Sie (und Ihr Team) an Java gewöhnt sind, aber JavaScript für eine Website erstellen müssen, sollten Sie vielleicht Google Web Toolkit (GWT) in Betracht ziehen. Sie können JavaScript mit Java, das in JavaScript konvertiert wird, codieren. Ich habe es jedoch nicht ausprobiert.

JavaScript ist eigentlich eine ziemlich coole Sprache. Es hat ein paar Mängel (einschließlich erlaubt Ihnen, sehr dumme Sachen zu tun), aber mit ein wenig Selbstdisziplin können Sie tolle Sachen machen. JavaScript ist eigentlich Objekt -orientierte, nicht so sehr Klasse-orientierte, aber Sie können viel von den gleichen Sachen tun. Sie haben keine (AFAIK) Vererbung, aber es ist überhaupt nicht streng (eine seiner mächtigen aber auch gefährlichen Eigenschaften) mit dem Schreiben, so dass Sie feststellen werden, dass es nicht einschränkend ist.