Objektorientierte JavaScript-Werkzeuge

Question

Ich habe an der Benutzeroberfläche meiner Website gearbeitet ( www.swalif.com (Verwenden Sie Chrome zum Übersetzen, wenn Sie das möchten). Da ich mich mit jQuery nicht auskenne, habe ich mit JavaScript angefangen und jetzt ist die Datei riesig: etwa 1000 Zeilen Code. Außerdem ist der Code immer komplexer zu handhaben und zu ändern.

Daher suchte ich nach einer Möglichkeit, dieses Problem objektorientiert anzugehen, um ein sauberes, wiederverwendbares System mit einer guten Architektur zu erhalten. Auch wäre es schön, Funktionen wie von JQuery zur Verfügung gestellt zu verwenden, um den Code klein zu halten .

Das Problem ist, dass es eine Menge Tools gibt und ich mich nicht entscheiden kann, in welches ich Zeit investieren soll, um diese Aufgabe zu bewältigen. z.B. mootools, prototype, jQuery, etc. Ich brauche also jemanden, der mich in die richtige Richtung führt.

Dies ist unsere Website www.swalif.com . Alle anderen Vorschläge sind ebenfalls willkommen.

Answer 1

Für die objektorientierte Javascript-Entwicklung würde ich John Resig's Einfache Javascript-Vererbung . Es ist ein kleines Stück Javascript, das Ihnen erlaubt, Klassen zu definieren, von Basisklassen abzuleiten und Methoden außer Kraft zu setzen.

var Person = Class.extend({
  init: function(isDancing){
    this.dancing = isDancing;
  },
  dance: function(){
    return this.dancing;
  }
});
var Ninja = Person.extend({
  init: function(){
    this._super( false );
  },
  dance: function(){
    // Call the inherited version of dance()
    return this._super();
  },
  swingSword: function(){
    return true;
  }
});

var p = new Person(true);
p.dance(); // => true

var n = new Ninja();
n.dance(); // => false
n.swingSword(); // => true

// Should all be true
p instanceof Person && p instanceof Class &&
n instanceof Ninja && n instanceof Person && n instanceof Class

Answer 2

Ich denke, Sie wären besser dran mit einem Rahmen, der aktiv entwickelt und ist mit OOP mit Erweiterbarkeit, Wiederverwendbarkeit, Mischungen, Mutatoren im Auge bauen.

Das ist genau der Grund MooTools geschaffen wurde.

Das heißt, wenn Sie nicht mit JS vertraut sind, wird es ziemlich schwierig sein, MooTools zu verstehen, da es kein Framework für Anfänger ist. Dann wieder, wenn Sie den Begriff der OOP begreifen, sollten Sie ok sein.

Answer 3

Verwenden Sie kein Framework, um Ihre OOP zu implementieren. Sie erhalten ein viel umfassenderes Verständnis von Javascript als Sprache, wenn Sie sich mit den Feinheiten der Verwendung von Javascript's très flexibles Funktionsprototypsystem zur Implementierung von OOP-ähnlichen Operationen.

Lesen Sie hier darüber: http://phrogz.net/JS/Classes/OOPinJS.html .

Answer 4

Wenn Sie nur Ihren Code organisieren müssen und keine Bibliotheken benötigen, können Sie http://code.google.com/p/joose-js/ . Andernfalls verwenden Sie das Oop-Modell der von Ihnen verwendeten Bibliothek.

Einfaches Beispiel

Module("Test", function (m) {
    Class("Point", {
        has: {
            x: {
                is:   "rw",
                init: 0
            },
            y: {
                is:   "rw",
                init: 0
            }
        },
        methods: {
            clear: function () {
                this.setX(0);
                this.setY(0);
            }
        }
    })
})