22. November 2006, 09:57, by Silvan Mühlemann

OOP in JavaScript

RhinozerosWeiterbildung ist ein Hauptthema bei den “IT-Team Meetings”, welche wir jede Woche durchführen. Gestern hat Ciprian uns eine Einführung in Objektorientierte JavaScript-Entwicklung gegeben.

Denn tausende Zeilen unstrukturierter Code ist bei komplexen RIA-Projekten ein Wartungs-Albtraum. Deshalb wird bei unseren nächsten Projekten Wert auf eine saubere Struktur gelegt.

Faszinierend an Javascript (offiziell ECMAScript genannt) ist das Objektkonzept. Bei PHP unterscheidet man zwischen Klassen und Objekten. Eine Klasse wird vor der Ausführung des Programms definiert und dann zur Laufzeit instanziert. Bei Javascript sind Klassen wie Objekte behandelt. Genau genommen instanziert man also ein Objekt und nicht eine Klasse, um sich ein Objekt zu erzeugen.

Das braucht uns bei der Implementierung noch nicht zu kümmern. Dank dem Javascript-Framework prototype.js kann man in JS mit Objekten und Klassen ganz ähnlich wie in PHP umgehen:

PHP:

// Definition der Klasse
class Person
{
protected $i_age;

public function Person($i_age)
{
$this->i_age=$i_age;
}

public function getAge()
{
return $this->i_age;
}
}

// Instanzierung
$o_person=new Person(18);

// Anwendung
echo $o_person->getAge();

Javascript (mit prototype.js)

Person=Class.create();

Person.prototype =
{
i_age: 0,

initialize: function(i_age)
{
this.i_age=i_age;
},

getAge: function()
{
return this.i_age;
}

}

o_kurt=new Person(17);
document.write(“Age of Kurt:”+o_kurt.getAge()+”
“)

Auf Klassen kann man somit wie auf Objekte zugreifen. Man kann der Klasse somit zur Laufzeit neue Methoden und Klassenvariablen hinzufügen. Dies macht man, indem man auf die spezielle Eigenschaft prototype des Objekts zugreift, und dieser neue Methoden oder Klassenvariablen zuordnet. Die Eigenschaft prototype zeigt auf die Vorlage des Objekts, den Prototypen. Bei einem Objekt ist die Vorlage also die Klasse.

Ich erweitere also das Skript von vorhin mit folgenden Zeilen:

// Code von Oben. o_kurt ist bereits instanziert.

// Erweiterung der Klasse zur Laufzeit
Person.prototype.allowedToDrive=function()
{
return this.i_age>=18;
}

o_paula=new Person(22);

// Methode ist in allen Objekten nun Verfügbar
document.write(“Kurt is allowed to drive? “+o_kurt.allowedToDrive()+”
“)
document.write(“Paula is allowed to drive?”+o_paula.allowedToDrive()+”
“)

Nachdem die Klasse generiert worden ist, können also noch zusätzliche Methoden oder Klassenvariablen hinzugefügt werden.

Mehr Informationen zum Thema findet ihr zum Beispiel hier.

Filed under: Programming

2 Comments

  1. Man kann in einigen OOP-Sprachen auf Klassen zugreifen ohne sie zu instanzieren und sie dann als Objekte (also quasi als Instanzen) verwenden. Habe gerade gestern darüber in meinem Blog geschrieben;)
    http://www.allerdings.ch/2006/11/static/

    P.S. Ist übrigens auch in PHP möglich…;) http://www.phpbuilder.com/manual/en/language.oop5.static.php

    Comment by Victor — 22. November 2006 @ 16:35

  2. Statische Methoden und Variablen und der direkte Zugriff auf die Klasse mittels dem “::”-Operator im PHP ist mir bekannt. Dies wird ja z.B. beim Singleton-Pattern so verwendet. Die Reflection-API bietet auch einen Zugriff auf die Klassen. Aber trotzdem ist die Klasse dann nicht automatisch ein Objekt und wird vom Interpreter anders behandelt. Für mich ist da JS eine Spur eleganter. Wie’s in C# ist, kannst Du mir ja mal zeigen :-)

    Comment by Silvan Mühlemann — 22. November 2006 @ 16:45

RSS feed for comments on this post.

Sorry, the comment form is closed at this time.

© 2017 tilllate Schweiz AG - Powered by WordPress