MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Diese Übersetzung ist unvollständig. Bitte helfen Sie, diesen Artikel aus dem Englischen zu übersetzen.

Zusammenfassung

Der Function constructor ("Funktions-Ersteller") erstellt ein neues Funktions-Objekt. In JavaScript ist eigentlich jede Funktion ein Funktions-Objekt.

Syntax

new Function ([arg1[, arg2[, ...argN]],] functionBody)

Parameter

arg1, arg2, ... argN
Namen die von der Funktion als formelle Argument-Name genutzt werden. Jeder davon muss ein String sein, welcher mit einem gültigen JavaScript identifier (Variablennamen) oder einer Liste von solchen Strings, getrennt mit einem Komma; zum Beispiel: "x", "derWert", oder "a,b", übereinstimmen.
functionBody
Ein String, welcher den JavaScript Ausdruck als Funktions-Definition beinhaltet.

Beschreibung

Mit dem Function Constructor erstellte Funktions-Objekte werden ausgewertet, sobald die Funktion erstellt wurde. Dies ist weniger effizient, als wenn man eine Funktion deklariert und diese innerhalb des Codes abruft, weil mit einem Funktions-Ausdruck deklarierte Funktionen mit dem Rest des Codes aufgerufen werden.

Alle der Funktion übergegebenen Argumente werden als Namen von Identifizierer (z.B. Variablennamen) als Parameter in der zu erstellenden Funktion behandelt - in der Reihenfolge, in welcher sie übergeben werden.

Hinweis: Die mit dem Function Constructor erstellten Funktionen erstellen keine Abgrenzung von ihrem Anwendungsbereich; sie werden immer im globalen Geltungsbereich erstellt. Wenn man sie aufrufen will, können diese nur über eigene lokale und globale Variable aufgerufen werden. Nicht jedoch im Geltungsbereich des erstellenden Function constructor. Dies ist der Unterschied zur Benutzung von eval mit dem Code für einen Funktions-Ausdruck.

Das Aufrufen des Function constructor als Funktion (ohne den "new" Operator) hat dieselbe Wirkung, wie es als Konstrukteur aufruft.

Eigenschaften und Methoden von Function

Das globale Function Objekt hat eigene Methoden und Eigenschaften, doch, da es eine Funktion selbst ist, erbt es einige Methoden und Eigenschaften durch die Prototypkette aus Function.prototype.

Function Prototyp Objekt

Eigenschaften

Function.arguments
An array corresponding to the arguments passed to a function. This is deprecated as property of Function, use the arguments object available within the function instead.
Function.arity
Used to specifiy the number of arguments expected by the function, but has been removed. Use the length property instead.
Function.caller
Specifies the function that invoked the currently executing function.
Function.length
Specifies the number of arguments expected by the function.
Function.name
The name of the function.
Function.displayName
The display name of the function.
Function.prototype.constructor
Specifies the function that creates an object's prototype. See Object.prototype.constructor for more details.

Methoden

Function.prototype.apply()
Calls a function and sets its this to the provided value, arguments can be passed as an Array object.
Function.prototype.bind()
Creates a new function which, when called, has its this set to the provided value, with a given sequence of arguments preceding any provided when the new function was called.
Function.prototype.call()
Calls (executes) a function and sets its this to the provided value, arguments can be passed as they are.
Function.prototype.isGenerator()
Returns true if the function is a generator; otherwise returns false.
Function.prototype.toSource()
Returns a string representing the source code of the function. Overrides the Object.prototype.toSource method.
Function.prototype.toString()
Returns a string representing the source code of the function. Overrides the Object.prototype.toString method.

Function Instanzen

Funktions-Instanzen erben Methoden und Eigenschaften vom Function.prototype. Wie bei allen constructor kannst du das Konstrukteur-Prototypen Objekt verändern, um Änderungen an allen Funktions-Instanzen durchzuführen.

Beispiele

Beispiel: Spezifizieren von Argumente mit dem Function constructor

Der folgende Code erstellt ein Funktions-Objekt, welches zwei Argumente entgegennimmt.

// Das Beispiel kannst du direkt in der JavaScript console laufen lassen.

// Erstellt eine Funktion, die zwei Argumente annimmt und gibt die Summe dieser Argumente zurück 

var adder = new Function('a', 'b', 'return a + b');

// Aufruf der Funktion
adder(2, 6);
// > 8

Die Argumente "a" und "b" sind formale Argument-Namen, welche im Funktions-Rumpf genutzt werden, "return a + b".

Beispiel: Eine rekursive Abkürzung um das DOM massiv zu modifzieren

Erstellen von Funktionen mit dem Function constructor ist ein Weg um dynamisch eine unbestimmte Anzahl von neuen Objekten mit ausführbaren Code in den globalen Geltungsbereichs aus einer Funktion zu erzeugen. Das folgende Beispiel (Eine rekursive Verknüpfung, um das DOM massiv zu modifizieren) ist unmöglich ohne den Aufruf des Function constructor für jeden neuen Query, wenn du Abschlüsse vermeiden möchtest.

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>MDN Example - a recursive shortcut to massively modify the DOM</title>
<script type="text/javascript">
var domQuery = (function() {
  var aDOMFunc = [
    Element.prototype.removeAttribute,
    Element.prototype.setAttribute,
    CSSStyleDeclaration.prototype.removeProperty,
    CSSStyleDeclaration.prototype.setProperty
  ];

  function setSomething(bStyle, sProp, sVal) {
    var bSet = Boolean(sVal), fAction = aDOMFunc[bSet | bStyle << 1],
        aArgs = Array.prototype.slice.call(arguments, 1, bSet ? 3 : 2),
        aNodeList = bStyle ? this.cssNodes : this.nodes;

    if (bSet && bStyle) { aArgs.push(''); }
    for (
      var nItem = 0, nLen = this.nodes.length;
      nItem < nLen;
      fAction.apply(aNodeList[nItem++], aArgs)
    );
    this.follow = setSomething.caller;
    return this;
  }

  function setStyles(sProp, sVal) { return setSomething.call(this, true, sProp, sVal); }
  function setAttribs(sProp, sVal) { return setSomething.call(this, false, sProp, sVal); }
  function getSelectors() { return this.selectors; };
  function getNodes() { return this.nodes; };

  return (function(sSelectors) {
    var oQuery = new Function('return arguments.callee.follow.apply(arguments.callee, arguments);');
    oQuery.selectors = sSelectors;
    oQuery.nodes = document.querySelectorAll(sSelectors);
    oQuery.cssNodes = Array.prototype.map.call(oQuery.nodes, function(oInlineCSS) { return oInlineCSS.style; });
    oQuery.attributes = setAttribs;
    oQuery.inlineStyle = setStyles;
    oQuery.follow = getNodes;
    oQuery.toString = getSelectors;
    oQuery.valueOf = getNodes;
    return oQuery;
  });
})();
</script>
</head>

<body>

<div class="testClass">Lorem ipsum</div>
<p>Some text</p>
<div class="testClass">dolor sit amet</div>

<script type="text/javascript">
domQuery('.testClass')
  .attributes('lang', 'en')('title', 'Risus abundat in ore stultorum')
  .inlineStyle('background-color', 'black')('color', 'white')('width', '100px')('height', '50px');
</script>
</body>

</html>

Spezifikationen

Spezifikation Status Kommentar
ECMAScript 1st Edition. Standard Initial definition. Implemented in JavaScript 1.0.
ECMAScript 5.1 (ECMA-262)
Die Definition von 'Function' in dieser Spezifikation.		 Standard  
ECMAScript 2015 (6th Edition, ECMA-262)
Die Definition von 'Function' in dieser Spezifikation.		 Standard  

Browserkompatibilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basis Unterstützung (Ja) (Ja) (Ja) (Ja) (Ja)
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basis Unterstützung (Ja) (Ja) (Ja) (Ja) (Ja) (Ja)

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter: 
 Mitwirkende an dieser Seite: StevenS77, Mingun
 Zuletzt aktualisiert von: StevenS77,