--- title: Methoden Definitionen slug: Web/JavaScript/Reference/Functions/Method_definitions tags: - ECMAScript 2015 - Funktionen - JavaScript - Objekte - Syntax translation_of: Web/JavaScript/Reference/Functions/Method_definitions original_slug: Web/JavaScript/Reference/Functions/Methoden_Definitionen ---
Beginnend mit ECMAScript 2015 wurde eine kürzere Syntax für Methodendefinitionen in Objekt Initialisierungen eingeführt. Es ist eine Abkürzung für die Zuweisung einer Funktion an einen Methodennamen.
var obj = {
property( parameters… ) {},
*generator( parameters… ) {},
// also with computed keys:
[property]( parameters… ) {},
*[generator]( parameters… ) {},
// compare ES5 getter/setter syntax:
get property() {},
set property(value) {}
};
Die Syntax der Kurzschreibweise ähnelt der in ECMAScript 2015 eingeführten Syntax der getter und setter.
Gegeben sei der folgende Quellcode:
var obj = {
foo: function() {},
bar: function() {}
};
Jetzt können Sie das abkürzen zu:
var obj = {
foo() {},
bar() {}
};
Hinweis: Die kurze Syntax benutzt benamte Funktionen statt anonymen Funktionen (wie in ...foo: function() {}...). Benamte Funktionen können sich vom Funktionskörper aus aufrufen (für anonyme Funktionen ist das unmöglich, weil sie keinen Bezeichner haben). Für mehr Details, siehe {{jsxref("Operators/function","function","#Beispiele")}}.
Generatormethoden können mit der kurzen Syntax ebenfalls definiert werden. Zu beachten ist, dass der Stern (*) in der kurzen Syntax nur vor dem Namen der Generatoreigenschaft geschrieben werden kann. * g(){} funktioniert, g *(){} funktioniert nicht.
// Using a named property (pre-ES2015)
var obj2 = {
g: function*() {
var index = 0;
while(true)
yield index++;
}
};
// The same object using shorthand syntax
var obj2 = {
* g() {
var index = 0;
while(true)
yield index++;
}
};
var it = obj2.g();
console.log(it.next().value); // 0
console.log(it.next().value); // 1
Alle Methodendefinitionen die keine Konstruktoren sind werden einen {{jsxref("TypeError")}} erzeugen, wenn man versucht sie zu instantieren.
var obj = {
method() {},
};
new obj.method; // TypeError: obj.method is not a constructor
var obj = {
* g() {}
};
new obj.g; // TypeError: obj.g is not a constructor (changed in ES2016)
var obj = {
a : "foo",
b(){ return this.a; }
};
console.log(obj.b()); // "foo"
Die Kurzschreib-Syntax unterstützt auch berechnete Eigenschaftsnamen.
var bar = {
foo0 : function (){return 0;},
foo1(){return 1;},
["foo" + 2](){return 2;},
};
console.log(bar.foo0()); // 0
console.log(bar.foo1()); // 1
console.log(bar.foo2()); // 2
| Spezifikation | Status | Kommentar |
|---|---|---|
| {{SpecName('ES2015', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ES2015')}} | Initiale Definition. |
| {{SpecName('ES7', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ES7')}} | Geändert, dass Generatormethoden ebenfalls nicht initialisierbar sind und einen Fehler schmeißen, wenn sie mit new eingesetzt werden. |
| {{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ESDraft')}} |
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Method definition shorthand | {{CompatChrome("39")}} | {{CompatGeckoDesktop("34")}} | {{CompatNo}} | {{CompatOpera("26")}} | {{CompatNo}} |
| Generator methods are not constructable (ES2016) | {{CompatUnknown}} | {{CompatGeckoDesktop("43")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
| Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Method definition shorthand | {{CompatNo}} | {{CompatNo}} | {{CompatGeckoMobile("34")}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} |
| Generator methods are not constructable (ES2016) | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("43")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
get" und "set" nicht valide Namen für Generatormethoden. Das wurde in {{bug(1073809)}} behoben.var o = {x() 12}; // SyntaxError