Function: name
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
name
は Function
オブジェクトの読み取り専用プロパティで、作成時に付けられた関数の名前、もしくは無名関数の場合は anonymous
または ''
(空文字列)を返します。
試してみましょう
const func1 = function () {}; const object = { func2: function () {}, }; console.log(func1.name); // 期待される出力結果: "func1" console.log(object.func2.name); // 期待される出力結果: "func2"
値
数値です。
Function: name のプロパティ属性 | |
---|---|
書込可能 | 不可 |
列挙可能 | 不可 |
設定可能 | 可 |
メモ: 標準外であった ES2015 以前の実装では、configurable
属性も false
であることに注意してください。
解説
関数の name
プロパティは、デバッグツールやエラーメッセージで関数を識別するために使用することができます。言語自体には意味づけは存在しません。
name
プロパティは読み取り専用のため、代入演算子で変更することはできません。
function someFunction() {} someFunction.name = "otherFunction"; console.log(someFunction.name); // someFunction
変更するには、 Object.defineProperty()
を使用してください。
name
プロパティは、関数が定義されている方法から通常推測されます。次の節では、それが推測されるさまざまな方法について記述します。
関数宣言
name
プロパティは関数宣言の名前を返します。
function doSomething() {} doSomething.name; // "doSomething"
デフォルトエクスポートされた関数の宣言
export default
宣言は、関数を式ではなく宣言としてエクスポートします。宣言が無名関数である場合、名前は "default"
となります。
// -- someModule.js -- export default function () {} // -- main.js -- import someModule from "./someModule.js"; someModule.name; // "default"
Function コンストラクター
Function()
コンストラクターで作成された関数は、 "anonymous" の名前になります。
new Function().name; // "anonymous"
関数式
関数式に名前が付いている場合、その名前が name
プロパティとして使用されます。
const someFunction = function someFunctionName() {}; someFunction.name; // "someFunctionName"
function
キーワードを使用して生成された関数式またはアロー関数は、名前が ""
(空文字列)になります。
(function () {}).name; // "" (() => {}).name; // ""
しかし、そのようなケースはまれです。通常、他の場所で式を参照するために、関数式には作成時に識別子に添付します(変数宣言など)。そのような場合、次のいくつかの節で示すように、名前を推測することができます。
名前付きであることが推測できない実用的な例としては、別の関数から返される関数があります。
function getFoo() { return () => {}; } getFoo().name; // ""
変数宣言とメソッド
変数とメソッドは、構文上の位置から無名関数の名前を推論できます。
const f = function () {}; const object = { someMethod: function () {}, }; console.log(f.name); // "f" console.log(object.someMethod.name); // "someMethod"
同じことが代入にも適用されます。
let f; f = () => {}; f.name; // "f"
初期化子と既定値
分割代入、デフォルト引数、クラスフィールドなどの初期化子(既定値)の関数は、バインド済みの識別子の名前を 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
短縮メソッド
const o = { foo() {}, }; o.foo.name; // "foo";
バインドされた関数
Function.bind()
が関数を作成する時、その名前は "bound " とその関数名を合わせたものとなります。
function foo() {} foo.bind({}).name; // "bound foo"
ゲッターとセッターの関数名
クラスでの関数名
関数名としてのシンボル
シンボル (Symbol
) が関数名として使用されており、そのシンボルに説明が存在する場合、メソッドの名前は角カッコで囲まれた説明となります。
const sym1 = Symbol("foo"); const sym2 = Symbol(); const o = { [sym1]() {}, [sym2]() {}, }; o[sym1].name; // "[foo]" o[sym2].name; // "[]"
プライベートプロパティ
プライベートフィールドとプライベートメソッドは、ハッシュ記号 (#
) が名前の一部に含まれます。
class Foo { #field = () => {}; #method() {} getNames() { console.log(this.#field.name); console.log(this.#method.name); } } new Foo().getNames(); // "#field" // "#method"
例
オブジェクトのコンストラクター名を示す
オブジェクトの「クラス」を調べるには、 obj.constructor.name
を使用することができます。
function Foo() {} // または class Foo {} const fooInstance = new Foo(); console.log(fooInstance.constructor.name); // "Foo"
しかし、静的メンバーは自分自身でクラスのプロパティとなるため、静的メソッドプロパティ name()
を持つほぼすべてのクラスについて、クラス名を取得することはできません。
class Foo { constructor() {} static name() {} }
static name()
メソッドが存在する場合、 Foo.name
はクラス名ではなく、 name()
関数オブジェクトへの参照を持つことになります。 fooInstance
のクラスを取得しようとして fooInstance.constructor.name
を使用しても、まったくクラス名は得られず、代わりに静的クラスメソッドへの参照が返されます。
const fooInstance = new Foo(); console.log(fooInstance.constructor.name); // ƒ name() {}
静的フィールドが存在するため、 name
も関数ではない可能性があります。
class Foo { static name = 123; } console.log(new Foo().constructor.name); // 123
クラスに name
という静的プロパティがある場合、「書き込み可能」にもなります。このような独自の手法を用いなければ、既定では「読み取り専用」となります。
Foo.name = "Hello"; console.log(Foo.name); // Foo に静的な "name" がある場合は "Hello"、そうでなければ "Foo" と表示
したがって、組み込みの name
プロパティに常にクラスの名前が格納されていることに頼っていると、期待通りに動作しない場合があります。
JavaScript 圧縮ツールおよび最小化ツール
警告:name
プロパティを使用しているときに、 JavaScript の圧縮(ミニファイ)や難読化のような変換を行う際には注意が必要です。これらのツールは JavaScript ビルドパイプラインの一部として、本番環境に設置する前にプログラムのサイズを縮小するためによく使用されます。これらの変換は、ビルド時に関数名を変更することがあります。
次のようなソースコードは、
function Foo() {} const foo = new Foo(); if (foo.constructor.name === "Foo") { console.log("'foo' は 'Foo' のインスタンスである"); } else { console.log("おおっと!"); }
このように圧縮されるかもしれません。
function a() {} const b = new a(); if (b.constructor.name === "Foo") { console.log("'foo' は 'Foo' のインスタンスである"); } else { console.log("おおっと!"); }
非圧縮版では、プログラムは "'foo' は 'Foo' のインスタンスである" とログ出力し、真値側の分岐を実行します。一方、圧縮版では動作が異なり、 else 側の分岐を実行します。例えば上記のように、 name
プロパティに依存している場合は、ビルドパイプラインで関数名が変更されないようにするか、関数に具体的な名前があるとは仮定しないようにしてください。
仕様書
Specification |
---|
ECMAScript® 2026 Language Specification # sec-function-instances-name |