aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/javascript/reference/global_objects/function/name
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
commit4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch)
treed4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/de/web/javascript/reference/global_objects/function/name
parent33058f2b292b3a581333bdfb21b8f671898c5060 (diff)
downloadtranslated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip
initial commit
Diffstat (limited to 'files/de/web/javascript/reference/global_objects/function/name')
-rw-r--r--files/de/web/javascript/reference/global_objects/function/name/index.html229
1 files changed, 229 insertions, 0 deletions
diff --git a/files/de/web/javascript/reference/global_objects/function/name/index.html b/files/de/web/javascript/reference/global_objects/function/name/index.html
new file mode 100644
index 0000000000..29a3903d56
--- /dev/null
+++ b/files/de/web/javascript/reference/global_objects/function/name/index.html
@@ -0,0 +1,229 @@
+---
+title: Function.name
+slug: Web/JavaScript/Reference/Global_Objects/Function/name
+tags:
+ - ECMAScript 2015
+ - Function
+ - JavaScript
+ - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/name
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary">Die nur lesende Eigenschaft <code><strong>name</strong></code> eines {{jsxref("Function")}} Objektes welche den Namen, der beim erstellen angegeben wurde enthält oder <code>"anonymous"</code> für anonyme Funktionen.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/function-name.html")}}</div>
+
+
+
+<div>{{js_property_attributes(0,0,1)}}</div>
+
+<div> </div>
+
+<div class="note">
+<p>Zu beachten ist, dass in nicht standardisierten implementierungen vor ES2015 das <code>configurable</code> Attribute ebenfalls <code>false</code> ist.</p>
+</div>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<h3 id="Name_bei_Funktionsanweisungen">Name bei Funktionsanweisungen</h3>
+
+<p>Die <code>name</code> Eigenschaft gibt den Namen einer Funktionsanweisung:</p>
+
+<pre class="brush: js">function doSomething() {}
+doSomething.name; // logs "doSomething"
+</pre>
+
+<h3 id="Name_bei_Function_Konstruktoren">Name bei <code>Function</code> Konstruktoren</h3>
+
+<p>Funktionen, die mit der Syntax <code>new Function(...)</code> oder nur <code>Function(...)</code> erstellt werden, erstellen {{jsxref("Function")}}  mit dem Namen "anonymous".</p>
+
+<pre class="brush: js">(new Function).name; // "anonymous"
+</pre>
+
+<h3 id="Gefolgerte_Funktionsnamen">Gefolgerte Funktionsnamen</h3>
+
+<p>Bei Variablen und Methoden kann der Name von anonymen Funktionen von ihrer syntaktischen Position gefolgert werden (neu in ECMAScript 2015).</p>
+
+<pre class="brush: js">var f = function() {};
+var object = {
+ someMethod: function() {}
+};
+
+console.log(f.name); // "f"
+console.log(object.someMethod.name); // "someMethod"
+</pre>
+
+<p>Funktionen mit einem Namen lassen sich mittels {{jsxref("Operators/Function", "Funktionanweisung", "", 1)}} definieren:</p>
+
+<pre class="brush: js">var object = {
+ someMethod: function object_someMethod() {}
+};
+console.log(object.someMethod.name); // logs "object_someMethod"
+
+try { object_someMethod } catch(e) { console.log(e); }
+// ReferenceError: object_someMethod is not defined
+</pre>
+
+<p>Man kann den Namen einer Funktion nicht ändern, weil diese Eigenschaft schreibgeschützt ist:</p>
+
+<div class="hidden">
+<p>Example below contradicts with what is said at the beginning of this section and doesn't work as described.</p>
+</div>
+
+<pre class="brush: js">var object = {
+ // anonyme Funktionsdefinition
+ someMethod: function() {}
+};
+
+object.someMethod.name = 'someMethod';
+console.log(object.someMethod.name); // leerer String, someMethod ist anonym
+</pre>
+
+<p>Um sie zu ändern, kann {{jsxref("Object.defineProperty()")}} eingesetzt werden.</p>
+
+<h3 id="Kurzform_von_Methodennamen">Kurzform von Methodennamen</h3>
+
+<pre class="brush: js">var o = {
+ foo(){}
+};
+o.foo.name; // "foo";
+</pre>
+
+<h3 id="Gebundene_Funktionsnamen">Gebundene Funktionsnamen</h3>
+
+<p>{{jsxref("Function.bind()")}} erzeugt eine Funktion mit dem Namen, der sich aus <code> "bound "</code> und dem Namen der Funktion zusammensetzt.</p>
+
+<pre class="brush: js">function foo() {};
+foo.bind({}).name; // "bound foo"</pre>
+
+<h3 class="brush: js" id="Funktionsnamen_für_Getter_und_Setter">Funktionsnamen für Getter und Setter</h3>
+
+<p>Beim Einsatz von <code><a href="/de/docs/Web/JavaScript/Reference/Functions/get">get</a></code> und <code><a href="/de/docs/Web/JavaScript/Reference/Functions/set">set</a></code> Zugriffseigenschaften wird "get" oder "set" im Funktionsnamen auftauchen.</p>
+
+<pre class="brush: js">var o = {
+ get foo(){},
+ set foo(x){}
+};
+
+var descriptor = Object.getOwnPropertyDescriptor(o, "foo");
+descriptor.get.name; // "get foo"
+descriptor.set.name; // "set foo"
+</pre>
+
+<h3 id="Funktionsnamen_in_Klassen">Funktionsnamen in Klassen</h3>
+
+<p>Über <code>obj.constructor.name</code> lässt sich die "Klasse" eines Objekts überprüfen (jedoch sollten die unten stehende Warnung berücksichtigt werden):</p>
+
+<pre class="brush: js">function Foo() {} // ES2015 Syntax: class Foo {}
+
+var fooInstance = new Foo();
+console.log(fooInstance.constructor.name); // logs "Foo"
+</pre>
+
+<div class="warning">
+<p><strong>Warnung:</strong> Der Skriptinterpreter wird die eingebaute <code>Function.name</code> Eigenschaft nur setzen, wenn eine Funktion keine eigene Eigenschaft mit dem Namen <em>name</em> hat (siehe Kapitel <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-setfunctionname">9.2.11 der ECMAScript2015 Sprachdefinition</a>). Jedoch spezifiziert ES2015 das <em>static</em> Schlüsselwort so, dass statische Methoden als eigene Eigenschaft des Klassenkonstruktorfunktion gesetzt wird (ECMAScript2015, <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-runtime-semantics-classdefinitionevaluation">14.5.14.21.b</a> + <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-object-initializer-runtime-semantics-propertydefinitionevaluation">12.2.6.9</a>).</p>
+</div>
+
+<p>Aus diesem Grund kann der Klassenname für jede Klasse mit einer statischen Methodeneigenschaft <code>name()</code> nicht bestimmt werden:</p>
+
+<pre class="brush: js">class Foo {
+ constructor() {}
+ static name() {}
+}
+</pre>
+
+<p>Mit einer <code>static name()</code> Methode hält <code>Foo.name</code> nicht mehr den aktuellen Klassennamen bereit, sondern eine Referenz zu dem <code>name()</code> Funktionsobjekt. Die oben stehende Klassendefinition in ES2015 Syntax kann in ES5 Syntax für Chrome oder Firefox wie folgt übersetzt werden:</p>
+
+<pre class="brush: js">function Foo() {}
+Object.defineProperty(Foo, 'name', { writable: true});
+Foo.name = function() {};
+</pre>
+
+<p>Beim Versuch die Klasse von <code>fooInstance</code> mithilfe von <code>fooInstance.constructor.name</code> herauszufinden, bekommt man nicht den Klassennamen, sondern eine Referenz auf die statische Methode. Beispiel:</p>
+
+<pre class="brush: js">var fooInstance = new Foo();
+console.log(fooInstance.constructor.name); // logs function name()
+</pre>
+
+<p>Man sieht zudem in der Beispiel  der ES5 Syntax für Chrome und Firefox, dass die Definition der statischen <code>Foo.name</code> Methode überschreibbar (<em>writable</em>) wird. Wird nicht angegeben, ist der Standard für solche Definition nur lesend (<em>read-only</em>).</p>
+
+<pre class="brush: js">Foo.name = 'Hello'
+console.log(Foo.name); // logs "Hello" if class Foo has a static name() property but "Foo" if not.
+</pre>
+
+<p>Aus diesem Grund darf man sich nicht darauf verlassen, dass <code>Function.name</code> immer den Klassennamen zurück gibt.</p>
+
+<h3 id="Symbols_als_Funktionsnamen">Symbols als Funktionsnamen</h3>
+
+<p>Wenn ein {{jsxref("Symbol")}} als Funktionsnamen genutzt wird und das Symbol eine Beschreibung (description) hat, ist der Methodennamen gleich der Beschreibung in eckigen Klammern.</p>
+
+<pre class="brush: js">var sym1 = Symbol("foo");
+var sym2 = Symbol();
+bar o = {
+ [sym1]: function(){},
+ [sym2]: function(){}
+};
+
+o[sym1].name; // "[foo]"
+o[sym2].name; // ""
+</pre>
+
+<h2 id="JavaScript-Kompressoren_und_-Minimierer">JavaScript-Kompressoren und -Minimierer</h2>
+
+<div class="warning">
+<p><strong>Warnung:</strong> Beim der Benutzung von <code>Function.name</code> ist Vorsicht geboten, wenn Codetransformtionen, wie JavaScript Kompressoren (Minimierer) oder Obfuscators, zum Einsatz kommen. Diese Werkzeuge werden häufig im Zuge von Werkzeugketten zum Bauen von JavaScript-Programmen eingesetzt um die Größe eines Programms zu für den Produktivbetrieb zu minimieren. Solche Werkzeuge ändern die Funktionsnamen häufig beim Erstellen.</p>
+</div>
+
+<p>Quelltext wie dieser:</p>
+
+<pre class="brush: js">function Foo() {};
+var foo = new Foo();
+
+if (foo.constructor.name === 'Foo') {
+ console.log("'foo' is an instance of 'Foo'");
+} else {
+ console.log('Oops!');
+}
+</pre>
+
+<p>wird manchmal zu folgendem Quelltext komprimiert:</p>
+
+<pre class="brush: js">function a() {};
+var b = new a();
+if (b.constructor.name === 'Foo') {
+ console.log("'foo' is an instance of 'Foo'");
+} else {
+ console.log('Oops!');
+}
+</pre>
+
+<p>In der nicht komprimierten Version läuft das Programm in den true-Zweig und gibt <code><em>'foo' is an instance of 'Foo'</em></code> aus. Die komprimierte Version verhält sich anders und läuft in den else-Zweig. Wenn man sich <code>Function.name</code> zurückerinnert, wie in obigen Beispielen, muss beachtet werden, dass Kompressoren die Methodennamen nicht ändert oder nicht annimmt, dass eine Funktion nur in diesem Quelltext benutzt.</p>
+
+<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-name', 'name')}}</td>
+ <td>{{Spec2('ES2015')}}</td>
+ <td>Initiale Definition.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-function-instances-name', 'name')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td> </td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
+
+<div>
+
+{{Compat("javascript.builtins.Function.name")}}</div>