IT-Academy Logo
Sign Up Login Help
Home - Programmieren - JavaScript - Ist JavaScript Objekt-orientiert?



Ist JavaScript Objekt-orientiert?

Obwohl nur wenige Leute es wissen, ist auch JavaScript ein Objekt-orientierte Programmiersprache.


Autor: Patrick Faes (dreamer)
Datum: 04-11-2004, 23:32:04
Referenzen: keine
Schwierigkeit: Anfänger
Ansichten: 9496x
Rating: 8 (4x bewertet)

Hinweis:

Für den hier dargestellte Inhalt ist nicht der Betreiber der Plattform, sondern der jeweilige Autor verantwortlich.
Falls Sie Missbrauch vermuten, bitten wir Sie, uns unter missbrauch@it-academy.cc zu kontaktieren.

[Druckansicht] [Als E-Mail senden] [Kommentar verfassen]



Einführung: was ist OOP?

Objekt-orientierte Programmierung (kurz OOP) ist eine Art der Programmierung die (wie der Name schon sagt) sich an Objekte orientiert. Was sich dahinter verbirgt kann ich am Besten an Hand eines Beispiels erklären:

Eine Automobilhersteller will ein neues Auto auf dem Markt bringen. Dafür lässt er seine Marketingstrategen eine Umfrage starten, wählt Farben aus, lässt einen Motor bauen, macht Testfahrten usw.
Nach 8-monatiger Entwicklungszeit ist der Wagen fertig und kommt auf dem Markt. Wenn der Wagen in Serienproduktion geht, lässt der Hersteller natürlich nicht für jedes Exemplar alles erneut machen. Nein, er nimmt die Baupläne des fertigen Autos und lässt an Hand davon einen neuen bauen.
Nach einiger Zeit, fragen seine Kunden ob es das Auto auch in einer anderen Farbe gibt. Erneut wird der Hersteller einfach die fertigen Baupläne nehmen und nur die Farbe ändern.
Nachdem das Auto bereits seit 6 Monaten auf dem Markt ist, steigen die Ölpreise enorm an. Deshalb soll ein neuer Motor her der weniger Benzin verbraucht. Auch hier kann der Hersteller die fertigen Baupläne nehmen und nur den Motor auswechseln.

Auch so verhält es sich mit der Programmierung. Teile des Programms die oft wiederverwendet werden sollen, werden in Objekte gespeichert (bis hier ist es noch dasselbe als wenn man mit Funktionen arbeiten würde). Der Unterschied zu einer Funktion ist, dass das Resultat des Codeteils gespeichert wird in eine Variable und jederzeit verfügbar ist.

Es gibt dabei drei Stufen:
  1. Ein Objekt: ist eine Sammlung von Berechnungen und Programmanweisungen die zusammen ein Resultat liefern (z.B. die Baupläne des Fahrzeugs aus obigem Beispiel).
  2. Eine Klasse: ein Objekt kann seine Eigenschaften vererben an unter liegende Objekte. Diese können dann zu einer Klasse gehören. Eine Klasse ist dabei ein Objekt das seine Eigenschaften vom Eltern-Objekt erbt und zusätzlich einige Eigenschaften selbst definiert (z.B. BMW Z3 mit Dieselmotor und BMW Z3 mit Benzinmotor).
  3. Eine Instanz: wenn im Laufe eines Programms ein neues Objekt aus einer Objektdefinition kreiert wird, nennt sich dies eine Instanz (z.B. ein neues Fahrzeug das an Hand der Baupläne gebaut wurde).
Dazu hat jedes Objekt Eingeschaften und Methoden:
  • Eigenschaften: sind Merkmale eines Objektes (z.B. Farbe und Größe)
  • Methoden: sind Funktionen die mit einem Objekt verwendet werden können (z.B. Typumwandlung, Änderung der Größe usw.)
In wie weit ist JavaScript Objekt-orientiert?

Die Frage stellt sich dann natürlich, in wie weit JavaScript überhaupt Objekt-orientiert ist. JavaScript ist nämlich nicht bekannt dafür, dass es Objekt-orientiert ist, sondern nehmen die meisten an, dass es komplett prozedural arbeitet (was bedeutet, dass der Code einfach von links nach rechts und von oben nach unten abgearbeitet wird). Dies hat damit zu tun dass, JavaScript vordefinierte Objekte verwendet. Sehen Sie sich z.B. mal diese Seite gut an und sagen Sie mir wieviele solcher Objekte Sie gesehen haben. Was? Sie haben keine Ahnung?

Nun, da gibt es so einige: der (in den meisten Browsern) blauen Balken ganz oben (der Titelbalken), der graue Balken unter der Seitenansicht (der Statusbalken), die Grafik rechts oben, das Formular links oben, die Ganzen Links auf der Seite usw.

Wie Sie sehen existiert die ganze Seite aus solche vordefinierte Objekte. Weil JavaScript auf diese gestützt ist, spricht man auch oft von "Objekt-abhängige Programmierung".

Ein Beispiel wie man die Eigenschaften eines Objekts anspricht:
document.getElementById('bild').style.backgroundColor
Hierbei spricht man die Hintergrundfarbe eines Elementes (andere Bezeichnung für eine Instanz eines Objektes) an.

Ein Beispiel wie man mittel JavaScript eine Methode eines Objekts anspricht:
document.formular_name.reset()
Die Methode reset() setzt ein Formular zurück auf die Anfangswerte.

Eine Liste mit JavaScript-Objekten finden Sie auf SelfHTML.de.

Selbst Objekte definieren

Aber natürlich kann Javascript auch selbst Objekte definieren. Wie anfangs schon gesagt wurde, dient dies dazu nicht immer denselben Code neu schreiben zu müssen. Dies macht den Code schlanker (kürzere Ladezeiten), übersichtlicher und vor allem flexibeler, da man nachher den Code nur einmal zentral zu ändern braucht.

Ich werde dies zeigen an Hand eines Beispiels:
<script type="text/javascript">
function bild(datei,ersetzen)
  {
  var grafik = new Image();
  grafik.src = datei;

  function laden()
    {
    if (grafik.complete)
      {
      document.images[ersetzen].src = grafik.src;
      clearInterval('ladevorgang');
      }
    }

  var ladevorgang = setInterval('laden()',1000);
  }

document.write('<img src="anzeige.gif" name="zu_ersetzen">');

ersetze = new bild('grafik.gif','zu_ersetzen');
</script>
Eine Objektdefinition sieht genau so aus wie die einer Funktion. Ein Objekt wird gebaut wenn man eine Variable gleich in ein neues Objekt stellt. Dafür braucht man den Konstruktor new. Beachten Sie, dass Sie immer genau soviele Parameter übergeben wie es auch in Objektdefinition gibt.

Das Objekt enthält alle notwendigen Informationen um das Resultat zu erreichen. In diesem Fall wird eine Grafik ersetzt durch eine andere Grafik die erst noch geladen werden muss (mehr dazu lesen Sie im Artikel JavaScript: Bild vorladen). Wenn Sie nur eine einzige Grafik nachladen, gibt es natürlich keinen Grund eigene Objekte zu definieren, anders sieht es da aus wenn man hunderte solche Grafiken nachladen muss.

Zum Schluss möchte ich noch sagen, dass man mit return (mehr dazu) einen Wert zurück liefern kann (z.B. ein Wahrheitswert).



Senior Member
Beitrag vom:
13-11-2004, 18:44:36

Ich finde du hast dein Ziel damit erreicht. Es wird ziemlich klar deutlich, dass JavaScript eine OOP Sprache ist.
Allerdings ist das für viele keine Neuigkeit.
Trotzdem guter Artikel.

-----------------------------------------------------


dreamer
Expert
Beitrag vom:
05-11-2004, 17:31:55

Ziel dieses Artikels war nicht zu erklären was alles mit OOP möglich ist (darüber kann man ganze Bücher vollschreiben), ich wollte nur kurz das Konzept an sich erklären, sodass deutlich wird in welcher Weise JS Objekt-orientiert ist.

-----------------------------------------------------


paedubucher
Professonial
Beitrag vom:
05-11-2004, 12:39:44

OOP

Ich fand deine Erklärung zum Thema OOP nicht allzu gut, ich habe auch teilweise etwas andere Vorstellungen davon.
Der Teil zu JavaScript ist dir aber gelungen!

-----------------------------------------------------


[back to top]



Userdaten
User nicht eingeloggt

Gesamtranking
Werbung
Datenbankstand
Autoren:04508
Artikel:00815
Glossar:04116
News:13565
Userbeiträge:16552
Queueeinträge:06245
News Umfrage
Ihre Anforderungen an ein Online-Zeiterfassungs-Produkt?
Mobile Nutzung möglich (Ipone, Android)
Externe API Schnittstelle/Plugins dritter
Zeiterfassung meiner Mitarbeiter
Exportieren in CSV/XLS
Siehe Kommentar



[Results] | [Archiv] Votes: 1147
Comments: 0