Funktion: name

Ein String.

Die name Eigenschaft der Funktion kann verwendet werden, um die Funktion in Debugging-Werkzeugen oder Fehlermeldungen zu identifizieren. Sie hat keine semantische Bedeutung für die Sprache selbst.

Die name Eigenschaft ist schreibgeschützt und kann nicht durch den Zuweisungsoperator geändert werden:

function someFunction() {}

someFunction.name = "otherFunction";
console.log(someFunction.name); // someFunction

Um sie zu ändern, verwenden Sie Object.defineProperty().

Die name Eigenschaft wird typischerweise aus der Art und Weise, wie die Funktion definiert ist, abgeleitet. In den folgenden Abschnitten werden wir die verschiedenen Arten beschreiben, wie sie abgeleitet werden kann.

Die name Eigenschaft gibt den Namen einer Funktionsdeklaration zurück.

function doSomething() {}
doSomething.name; // "doSomething"

Eine export default Deklaration exportiert die Funktion als Deklaration statt als Ausdruck. Wenn die Deklaration anonym ist, ist der Name "default".

// -- someModule.js --
export default function () {}

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Funktionen, die mit dem Function() Konstruktor erstellt werden, haben den Namen "anonymous".

new Function().name; // "anonymous"

Wenn die Funktionsexpression benannt ist, wird dieser Name als name Eigenschaft verwendet.

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

Anonyme Funktionsexpressionen, die entweder mit dem function Schlüsselwort oder der Syntax der Pfeilfunktion erstellt werden, haben standardmäßig "" (einen leeren String) als ihren Namen.

(function () {}).name; // ""
(() => {}).name; // ""

Solche Fälle sind jedoch selten — in der Regel, um die Funktion anderswo aufzurufen, wird die Funktionsexpression mit einem Bezeichner assoziiert. Der Name einer anonymen Funktionsexpression kann innerhalb bestimmter syntaktischer Kontexte abgeleitet werden, einschließlich: Variable Deklaration, Methode, Initialisierer und Standardwert.

Ein praktisches Beispiel, bei dem der Name nicht abgeleitet werden kann, ist eine Funktion, die von einer anderen Funktion zurückgegeben wird:

function getFoo() {
  return () => {};
}
getFoo().name; // ""

Variablen und Methoden können den Namen einer anonymen Funktion aus ihrer syntaktischen Position ableiten.

const f = function () {};
const object = {
  someMethod: function () {},
};

console.log(f.name); // "f"
console.log(object.someMethod.name); // "someMethod"

Das gleiche gilt für Zuweisungen:

let f;
f = () => {};
f.name; // "f"

Funktionen in Initialisierern (Standardwerten) von Destrukturierung, Standardparameter, Klassenfeldern usw. erben den Namen des zugeordneten Bezeichners als ihren name.

const [f = () => {}] = [];
f.name; // "f"

const { someMethod: m = () => {} } = {};
m.name; // "m"

function foo(f = () => {}) {
  console.log(f.name);
}
foo(); // "f"

class Foo {
  static someMethod = () => {};
}
Foo.someMethod.name; // someMethod

Function.prototype.bind() erzeugt eine Funktion, deren Name "bound" plus dem Funktionsnamen ist.

function foo() {}
foo.bind({}).name; // "bound foo"

Bei der Verwendung von get und set Accessor-Eigenschaften erscheinen "get" oder "set" im Funktionsnamen.

const o = {
  get foo() {
    return 1;
  },
  set foo(x) {},
};

const descriptor = Object.getOwnPropertyDescriptor(o, "foo");
descriptor.get.name; // "get foo"
descriptor.set.name; // "set foo";

Der Name einer Klasse folgt dem gleichen Algorithmus wie Funktionsdeklarationen und -ausdrücke.

class Foo {}
Foo.name; // "Foo"

Wenn ein Symbol als Funktionsname verwendet wird und das Symbol eine Beschreibung hat, ist der Name der Methode die Beschreibung in eckigen Klammern.

const sym1 = Symbol("foo");
const sym2 = Symbol();

const o = {
  [sym1]() {},
  [sym2]() {},
};

o[sym1].name; // "[foo]"
o[sym2].name; // "[]"

Private Felder und private Methoden haben das Hash-Zeichen (#) als Teil ihres Namens.

class Foo {
  #field = () => {};
  #method() {}
  getNames() {
    console.log(this.#field.name);
    console.log(this.#method.name);
  }
}

new Foo().getNames();
// "#field"
// "#method"

Sie können obj.constructor.name verwenden, um die "Klasse" eines Objekts zu überprüfen.

function Foo() {} // Or: class Foo {}

const fooInstance = new Foo();
console.log(fooInstance.constructor.name); // "Foo"

Da jedoch statische Mitglieder zu eigenen Eigenschaften der Klasse werden, können wir den Klassennamen für praktisch jede Klasse mit einer statischen Methoden-Eigenschaft name() nicht erhalten:

class Foo {
  constructor() {}
  static name() {}
}

Mit einer static name() Methode hält Foo.name nicht mehr den tatsächlichen Klassennamen, sondern eine Referenz auf das name() Funktionsobjekt. Der Versuch, die Klasse von fooInstance über fooInstance.constructor.name zu erhalten, gibt uns überhaupt nicht den Klassennamen, sondern eine Referenz auf die statische Klassenmethode. Beispiel:

const fooInstance = new Foo();
console.log(fooInstance.constructor.name); // ƒ name() {}

Aufgrund der Existenz von statischen Feldern kann name auch keine Funktion sein.

class Foo {
  static name = 123;
}
console.log(new Foo().constructor.name); // 123

Wenn eine Klasse eine statische Eigenschaft namens name hat, wird sie auch beschreibbar. Die eingebaute Definition in Abwesenheit einer benutzerdefinierten statischen Definition ist schreibgeschützt:

Foo.name = "Hello";
console.log(Foo.name); // "Hello" if class Foo has a static "name" property, but "Foo" if not.

Daher können Sie sich nicht darauf verlassen, dass die eingebaute name Eigenschaft immer den Namen einer Klasse hält.

Quellcode wie:

function Foo() {}
const foo = new Foo();

if (foo.constructor.name === "Foo") {
  console.log("'foo' is an instance of 'Foo'");
} else {
  console.log("Oops!");
}

kann komprimiert werden zu:

function a() {}
const b = new a();
if (b.constructor.name === "Foo") {
  console.log("'foo' is an instance of 'Foo'");
} else {
  console.log("Oops!");
}

In der unkomprimierten Version geht das Programm in den truthy-Branch und protokolliert "'foo' is an instance of 'Foo'" – während es sich in der komprimierten Version anders verhält und in den else-Branch gelangt. Wenn Sie sich auf die name Eigenschaft verlassen, wie im obigen Beispiel, stellen Sie sicher, dass Ihre Erstellungs-Pipeline keine Funktionsnamen ändert, oder gehen Sie nicht davon aus, dass eine Funktion einen bestimmten Namen hat.

• Polyfill für Function: name in core-js
• es-shims Polyfill von Function.prototype.name
• Function