Function.prototype.name

The name property of a Function instance indicates the function's name as specified when it was created, or it may be either anonymous or '' (an empty string) for functions created anonymously.

Value

A string.

Note: In non-standard, pre-ES2015 implementations the configurable attribute was false as well.

Description

The function's name property can be used to identify the function in debugging tools or error messages. It has no semantic significance to the language itself.

The name property is read-only and cannot be changed by the assignment operator:

function someFunction() {}

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

To change it, use Object.defineProperty().

The name property is typically inferred from how the function is defined. In the following sections, we will describe the various ways in which it can be inferred.

Function declaration

The name property returns the name of a function declaration.

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

Default-exported function declaration

An export default declaration exports the function as a declaration instead of an expression. If the declaration is anonymous, the name is "default".

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

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

someModule.name; // "default"

Function constructor

Functions created with the Function() constructor have name "anonymous".

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

Function expression

If the function expression is named, that name is used as the name property.

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

Anonymous function expressions created using the keyword function or arrow functions would have "" (an empty string) as their name.

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

However, such cases are rare — usually, in order to refer to the expression elsewhere, the function expression is attached to an identifier when it's created (such as in a variable declaration). In such cases, the name can be inferred, as the following few subsections demonstrate.

One practical case where the name cannot be inferred is a function returned from another function:

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

Variable declaration and method

Variables and methods can infer the name of an anonymous function from its syntactic position.

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

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

The same applies to assignment:

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

Initializer and default value

Functions in initializers (default values) of destructuring, default parameters, class fields, etc., will inherit the name of the bound identifier as their 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

Shorthand method

const o = {
  foo() {},
};
o.foo.name; // "foo";

Bound function

Function.prototype.bind() produces a function whose name is "bound " plus the function name.

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

Getter and setter

When using get and set accessor properties, "get" or "set" will appear in the function name.

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

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

Class

A class's name follows the same algorithm as function declarations and expressions.

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

Warning: JavaScript will set the function's name property only if a function does not have an own property called name. However, classes' static members will be set as own properties of the class constructor function, and thus prevent the built-in name from being applied. See an example below.

Symbol as function name

If a Symbol is used a function name and the symbol has a description, the method's name is the description in square brackets.

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

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

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

Private property

Private fields and private methods have the hash (#) as part of their names.

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

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