Versionen vergleichen

Mit Objekten arbeiten

Version 350637:

Version 350637 von eminor am

Version 351753:

Version 351753 von eminor am

Titel:
Mit Objekten arbeiten
Mit Objekten arbeiten
Adressname:
JavaScript/javascript_guide/Mit_Objekten_arbeiten
JavaScript/javascript_guide/Mit_Objekten_arbeiten
Inhalt:

Version 350637
Version 351753
n101    <h3 id="Objekte">n101    <h3 id="Fast_alles_ist_ein_Objekt">
tt185      Auch mit Objekt Literalen können Arrays erstellt werden, si
 >ehe <a href="/de/docs/JavaScript/javascript_guide/Werte,_Variable
 >n_und_Literale#Array-Literale">Array Literale</a>.
186    </p>
187    <p>
188      Bei JAvaScript 1.1 und früher können Objekt-Literale nicht 
 >eingesetzt werden. Objekte können nur mit Hilfe der Konstruktorfu
 >nktionen oder einer Funktion, die durch ein anderes Objekt bereit
 >gestellt wird und diese Aufgabe erledigt, erstellt werden (Siehe 
 >nächster Abschnitt).
189    </p>
190    <h3>
191      Benutzung einer Konstruktor-Funktion
192    </h3>
193    <p>
194      Alternativ kann ein Objekt über die beiden folgenden Schrit
 >te erstellt werden:
195    </p>
196    <p>
197      Definition des Objekttyps durch Schreiben einer Konstruktor
 >funktion. Es gibt eine Übereinkunft, dass man für diese Funktion 
 >einen großen Anfangsbuchstaben verwendet. Erstellen einer Instanz
 > des Objekts mit Hilfe von <code>new</code>.
198    </p>
199    <p>
200      Zur Defintion des Objekttyps wird eine Funktion für diesen 
 >Typ erstellt, welche den Namen, die Eigenschaften und Methoden en
 >thält. Angenommen es soll ein Objekttyp für Automobile erstellt w
 >erden. Das Objekt soll <code>car</code> heißen und die drei Eigen
 >schaften <code>make</code>, <code>model</code> und <code>year</co
 >de> besitzen. Dann definiert man eine Funktion <code>Car</code>, 
 >welche die Werte für die Eigenschaften als Parameter entgegennimm
 >t:
201    </p>
202    <pre class="brush: js">
203function Car(make, model, year) {
204  this.make = make;
205  this.model = model;
206  this.year = year;
207}
208</pre>
209    <p>
210      Bei dieser Funktion wird das Schlüsselwort <code>this</code
 >> eingesetzt, um den Eigenschaften des Objekts die Werte der Argu
 >mente zuzuweisen.
211    </p>
212    <p>
213      Anschließend kann mit Hilfe dieser Funktion ein Objekt myca
 >r erstellt werden:
214    </p>
215    <pre class="brush: js">
216var mycar = new Car("Eagle", "Talon TSi", 1993);
217</pre>
218    <p>
219      Mit dieser Zuweisung wird das Objekt <code>mycar</code> ers
 >tellt und die Argumentwerte werden den Eigenschaften zugewiesen. 
 >Die Eigenschaft <code>mycar.make</code> bekommt den Wert "Eagle",
 > <code>mycar.year</code> den Wert 1993 usw.
220    </p>
221    <p>
222      Über den Aufruf von <code>new</code> können beliebig viele 
 >Objekte erstellt werden. Zum Beispiel:
223    </p>
224    <pre class="brush: js">
225var kenscar = new Car("Nissan", "300ZX", 1992);
226var vpgscar = new Car("Mazda", "Miata", 1990);
227</pre>
228    <p>
229      Ein Objekt kann eine Eigenschaft haben, die selbst wieder e
 >in Objekt ist. Angenommen man erstellt ein Objekt <code>Person</c
 >ode> wie folgt:
230    </p>
231    <pre class="brush: js">
232function Person(name, age, sex) {
233  this.name = name;
234  this.age = age;
235  this.sex = sex;
236}
237</pre>
238    <p>
239      Und erzeugen dann zwei Instanzen dieses Objekts:
240    </p>
241    <pre class="brush: js">
242var rand = new Person("Rand McKinnon", 33, "M");
243var ken = new Person("Ken Jones", 39, "M");
244</pre>
245    <p>
246      Dann kann man die Funktion <code>Car</code> erweitern, dami
 >t das Objekt eine weitere Eigenschaft owner besitzt, der ein Pers
 >on-Objekt zugewiesen werden kann<code>:</code>
247    </p>
248    <pre class="brush: js">
249function Car(make, model, year, owner) {
250  this.make = make;
251  this.model = model;
252  this.year = year;
253  this.owner = owner;
254}
255</pre>
256    <p>
257      Nun können Instanzen des Objekts wie folgt erzeugt werden:
258    </p>
259    <pre class="brush: js">
260var car1 = new Car("Eagle", "Talon TSi", 1993, rand);
261var car2 = new Car("Nissan", "300ZX", 1992, ken);
262</pre>
263    <p>
264      Hierbei wern nun nicht nur String- und Integer-Werte, sonde
 >rn auch jeweils ein Besitzer-Objekt (<code>rand</code> und <code>
 >ken</code>) an die Funktion übergeben. Den Besitzer von <code>car
 >1</code> kann man nun z. B. über folgende Eigenschaft herausfinde
 >n:
265    </p>
266    <pre class="brush: js">
267car2.owner.name
268</pre>
269    <p>
270      Eigenschaften können jederzeit zu einem bereits vordefinier
 >ten Objekt hinzugefügt werden. Diese Zuweisung:
271    </p>
272    <pre class="brush: js">
273car1.color = "black";
274</pre>
275    <p>
276      fügt dem Objekt car1 die Eigenschaft <code>color</code> mit
 > dem Wert <code>"black"</code> hinzu. Dies betrifft allerdings ke
 >ine der anderen Instanzen. Um allen Instanzen die neue Eigenschaf
 >t hinzuzufügen, muss die Definition des <code>car</code> Objektty
 >ps erweitert werden.
277    </p>
278    <h3>
279      Benutzung der Methode Objekt.create
280    </h3>
281    <p>
282      Objekte können auch mit Hilfe der Methode <code>Object.crea
 >te</code> erstellt werden. Dieser Methode kann sehr nützlich sein
 >, da sie erlaubt, das entsprechende Prototype-Objekt ohne die Def
 >inition einer Konstruktorfunktion auszuwählen. Weitere Informatio
 >nen findet man in der <a href="/en-US/docs/JavaScript/Reference/G
 >lobal_Objects/Object/create" title="/en-US/docs/JavaScript/Refere
 >nce/Global_Objects/Object/create">Referenz</a>.
283    </p>
284    <h3>
285      Vererbung
286    </h3>
287    <p>
288      Alle Objekte bei JavaScript erben von wenigstens einem ande
 >ren Objekt. Das Objekt, von dem geerbt wird, nennt man Prototype.
 > Die vererbten Eigenschaften können im Prototyp-Objekt des Konstr
 >uktors gefunden werden.
289    </p>
290    <h3>
291      Indexieren von Objekt-Eigenschaften
292    </h3>
293    <p>
294      Bei JavaScript 1.0 kann über den Namen oder den Index auf d
 >ie Eigenschaft eines Objekt zugegriffen werden. Bei JavaScript 1.
 >1 und neuer muss der Zugriff auf eine Eigenschaft wieder über den
 > Namen erfolgen, wenn sie über den Namen definiert wurde und über
 > den Index, wenn sie über den Index definiert wurde.
295    </p>
296    <p>
297      Diese Beschränkung gilt sowohl für Objekte und ihre Eigensc
 >haften, wenn sie über die Konstruktorfunktion erstellt wurden (wi
 >e im vorherigen Abschnitt beim car-Objekt) als auch wenn verschie
 >dene Eigenschaften explizit definiert werden (zum Beispiel <code>
 >myCar.color = "red"</code>). Wenn man anfänglich eine Objekt-Eige
 >nschaft über ihren Index definiert, z. B. <code>myCar[5] = "25 mp
 >g"</code>, so lässt sich diese Eigenschaft später nur über <code>
 >myCar[5]</code> ansprechen.
298    </p>
299    <p>
300      Eine Ausnahme für diese Regel gibt es bei Objekten, die von
 > HTML stammen, wie z. B. dem forms-Array. Auf diese Objekte kann 
 >entweder über ihre Nummer (basierend darauf, wo sie im Dokument v
 >orkommen) oder ihren Namen (falls definiert) zugegriffen werden. 
 >Wenn im Dokument z. B. das zweite Formular-Tag <code>&lt;FORM&gt;
 ></code> ein <code>NAME</code>-Attribute mit dem Wert <code>"myFor
 >m"</code> hat, kann dieses Formular über <code>document.forms[1],
 ></code> <code>document.forms["myForm"]</code> oder <code>document
 >.myForm</code> angesprochen werden.
301    </p>
302    <h3>
303      Definition von Eigenschaften für einen Objekttyp
304    </h3>
305    <p>

Zurück zur Versionsgeschichte