1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
|
---
title: Konstruktor
slug: Web/JavaScript/Reference/Klassen/constructor
tags:
- ECMAScript 2015
- JavaScript
- Klassen
translation_of: Web/JavaScript/Reference/Classes/constructor
---
<div>{{jsSidebar("Classes")}}</div>
<p>Die <code>constructor</code> Methode ist eine spezielle Methode für das erzeugen und initialisieren von Objekten, die mit dem Schlüsselwort <code>class </code>erzeugt wurden.</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">constructor([Argumente]) { ... }</pre>
<h2 id="Beschreibung">Beschreibung</h2>
<p>In einer Klasse kann es nur eine Methode mit dem Namen "constructor" geben. Eine {{jsxref("SyntaxError")}} Fehlermeldung wird geworfen, wenn in einer Klasse die <code>constructor</code> Methode mehr als einmal vorhanden ist.</p>
<p>Die <code>constructor </code>Methode kann mit dem Schlüsselwort <code>super </code>die <code>constructor </code>Methode der Eltern-Klasse aufrufen.</p>
<p>Wenn man keine <code>constructor </code>Methode erzeugt, wird eine Standardkonstruktor verwendet.</p>
<h2 id="Beispiele">Beispiele</h2>
<h3 id="Verwendung_der_constructor_Methode">Verwendung der <code>constructor</code> Methode</h3>
<p>Dieser Quellcode Ausschnitt wurden vom <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">classes Beispiel</a> (<a href="https://googlechrome.github.io/samples/classes-es6/index.html">live Demo</a>) übernommen.</p>
<pre class="brush: js">class Square extends Polygon {
constructor(length) {
// Hier wird die constructor Methode der Eltern-Klasse aufgerufen,
// für die Parameter width und height wurde der übergebene length Parameter verwendet
super(length, length);
// Anmerkung: In abgeleiteten Klassen, muss die super() Methode aufgerufen werden,
// bevor man das 'this' Objekt verwenden kann, da es sonst zu einen Referenz Fehler kommt
this.name = 'Square';
}
get area() {
return this.height * this.width;
}
set area(value) {
this.area = value;
}
}</pre>
<h3 id="Standardkonstruktoren">Standardkonstruktoren</h3>
<p>Wenn man keine <code>constructor </code>Methode anlegt, wird eine Standardkonstruktor verwendet. Für Basis Klassen ist der Standard Konstruktor:</p>
<pre class="brush: js">constructor() {}
</pre>
<p>Für vererbte Klassen, ist das der Standardkonstruktor:</p>
<pre class="brush: js">constructor(...args) {
super(...args);
}</pre>
<h2 id="Spezifikationen">Spezifikationen</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spezifikation</th>
<th scope="col">Status</th>
<th scope="col">Kommentar</th>
</tr>
<tr>
<td>{{SpecName('ES2015', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
<td>{{Spec2('ES2015')}}</td>
<td>Initiale Definition.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatChrome(42.0)}}</td>
<td>{{CompatGeckoDesktop(45)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>Default constructors</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop(45)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Android Webview</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(42.0)}}</td>
<td>{{CompatGeckoMobile(45)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatChrome(42.0)}}</td>
</tr>
<tr>
<td>Default constructors</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile(45)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Siehe_auch">Siehe auch</h2>
<ul>
<li><a href="/de/docs/Web/JavaScript/Reference/Operators/super">super()</a></li>
<li><a href="/de/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
<li><a href="/de/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
<li><a href="/de/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
</ul>
|
