Objektorientierung in Javascript

Hej!

Ich wurde in letzter Zeit häufig gefragt, wie es sich eigentlich mit Javascript und Objektorientierung verhält. Javascript hat nicht wirklich feste Programmierparadigma (Programmierstil). Das gilt auch für Objektorientierte Programmierung. Durch diese fehlenden Vorgaben muss man sich das alles selbst herleiten. Das ist für bereits in anderen Sprachen mit festen Paradigma erfahrene Anwender anfangs extrem schwierig und für absolute Programmieranfänger schlciht unmöglich. Daher möchte ich hier ein wenig Licht ins Dunkel bringen und nebenbei auch die ein oder andere Parallele zu anderen Skript- und Programmiersprachen ziehen.

Falls Fragen oder Unklarheiten auftauchen ist jeder herzlich eingeladen sie hier zu posten.

Absätze, die sich eher an Anfänger richten, werde ich durch ein vorangestelltes "Grundlagen:" markieren, damit sie von erfahreneren Nutzern, falls gewünscht, übersprungen werden können.

Was solltest DU bereits wissen?

Grundlegendes Verständnis für Javascript sollte vorhanden sein. Das bezieht vor allem Folgendes ein:

• Variablen (?)
• Funktionen (?)
• Rechenoperationen (?)
• Simple Kontrollstrukturen (?)
• Einfache Programmabläufe

Falls etwas unbekannt ist, kann über das Fragezeichen dahinter fehlendes Wissen aufgeholt werden.

1.0 Was ist eine Klasse?

Grundlagen: Eine Klasse kann als eine Sammlung von verschiedenen Variablen und Funktionen, die diese verarbeiten, bezeichnet werden. Da es in Javascript keine offensichtlichen Variablentypen gibt, ist dies auf den ersten Blick umso undurchsichtiger. In Sprachen mit starker Typisierung (das heißt, jeder Variable muss ein Typ zugewiesen werden und es können nur Inhalte dieses Typs erfasst werden) ist das Ganze etwas ersichtlicher.
Eine Klasse beinhaltet wie bereits gesagt verschiedene Variablen, welche man Eigenschaften nennt, und verschiedene Funktionen, welche Methoden genannt werden. Hier findet sich ein Beispiel einer Klasse (keine Programmierkenntnisse erforderlich).

In den meisten Sprachen gibt es ein spezielles Keyword, mit dem eine Klasse angelegt werden kann. Hier z. B. in PHP:

class Person {
    $name;
    $age;
}

Oder in C++:

class Person {
public:
    int age;
    string name;
}

In Javascript entfällt dieses class-Keyword jedoch. Grundlegend ist jede Javascript Funktion auch eine Klasse.

function Person()
{
    this.name;
    this.age;
}

Ob dieser Codeabschnitt als Klasse oder Funktion behandelt wird, entscheidet sich jetzt im Aufruf. Durch das zuweisen zu einer Variable mit dem Keyword new (für: neue Instanz anlegen) legt Javascript eine neue Instanz an. Eine Instanz ist eine Kopie der Klasse mit allen Eigenschaften und Methoden, die unabhängig von anderen Instanzen ist.

// Einfacher Funktionsaufruf
Person();




// Instanziierung der Klasse "Person"
var Klaus = new Person();

1.1 Wie füge ich nun Eigenschaften hinzu?

Eigenschaften sind schon vorhanden. Sowohl this.name, als auch this.age sind Eigenschaften. Das this-Keyword wird später erklärt.

1.2 Konstruktor?

Grundlagen: Der Konstruktor ist eine spezielle Funktion, welche immer zusammen mit der Instanziierung der Klasse aufgerufen wird. Dort werden in der Regel initiale Einstellungen für die Klasse getroffen. Ebenso lassen sich bereits Parameter übergeben, um die erstellten Eigenschaften mit Inhalt zu füllen:

function Person(name, age)
{
    this.name = name;
    this.age = age;
}

Beim Instanziieren der Klasse können jetzt Werte übergeben werden:

// Instanziierung der Klasse "Person"
var Klaus = new Person("Klaus", 37);

An dieser Stelle sei erwähnt, dass es in Javascript keine Möglichkeit gibt sinnvoll Destruktoren zu setzen.

1.3 Weitere Funktionen hinzufügen?

Das geht genau so einfach, wie Eigenschaften erstellen:

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

    this.getName = function()
    {
        return this.name;
    }
}

Die Funktion kann nun aufgerufen werden und gibt den Namen zurück:

// Instanziierung der Klasse "Person"
var Klaus = new Person("Klaus");
console.log(Klaus.getName());

1.4 Private Eigenschaften und Methoden?

Private Eigenschaften und Methoden sind solche, die außerhalb der Klasse nicht aufgerufen werden können. Leider unterstützt Javascript keine Paradigma hierfür.
Über das var-Keyword lässt sich ein Workaround erstellen. Das ist jedoch aufwändig und rentiert sich eher nicht. Hier gilt die klare Empfehlung zu verzichten.
Einsteiger in die Objektorientierung können an der Stelle aufatmen, private, public und protected sind in den meisten Objektorientierten Sprachen jedoch extrem wichtig
und wenn man sie gewohnt ist, fehlen sie einem schnell.

1.5 Prototype?

Hier haben besonders Entwickler Schwierigkeiten, die bereits andere Programmiersprachen gewohnt sind. Jede Funktion (und damit jede Klasse) hat einen Prototypen. Darin werden alle Eigenschaften und Methoden gespeichert. Wenn mittels this eine Eigenschaft oder Methode initiiert wird, landet diese im Prototypen.

Das ist zum Beispiel nützlich wenn man der Übersicht halber eine Methode nicht im Konstruktor definieren möchte:

function Person(name)
{
    this.name = name;
}




Person.prototype.getName = function()
{
    return this.name;
}

So lässt sich enorm viel Übersicht gewinnen.

Achtung! Private Eigenschaften und Methoden werden nicht im Prototypen erfasst!

1.6 Das wars?

Nein. Aber fürs Erste soll es das gewesen sein. In Kürze werde ich noch über Vererbung, also die Kommunikation zwischen verschiedenen Klassen, schreiben. Außerdem
werde ich Schritt für Schritt eine Klasse aufbauen und erklären. Das Ganze im Bezug auf ein sinnvolles Beispiel im Alltag.

Ich hoffe ich konnte dem ein oder anderen ein wenig Licht ins Dunkel bringen.

PS.: Yay, 2k

[Reserviert]

[Reserviert]