Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【JavaScript ECMAScript】Function::Function: displayNameインスタンスデータプロパティの使い方

Function: displayNameインスタンスデータプロパティの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

Function: displayNameプロパティは、JavaScriptの関数がデバッグ時やプロファイリング時に開発ツール上でどのように表示されるかを指定するために使用されるプロパティです。このプロパティに任意の文字列を設定することで、関数にわかりやすい表示名を与えることができます。

JavaScriptには、名前が明示的に付けられていない無名関数や、変数に代入されたアロー関数など、関数の名前が自動的に推論されるか、あるいは全く表示されない場合があります。このような関数をデバッグする際、開発ツールのコールスタックやプロファイラなどで関数が正しく識別されず、問題の特定が難しくなることがあります。Function: displayNameプロパティに文字列を設定すると、開発ツール上でその関数が設定した名前で表示されるようになるため、デバッグ作業の効率が向上します。

しかし、このdisplayNameプロパティはECMAScriptの標準仕様の一部ではなく、主にMozilla系の環境でサポートされている非標準のプロパティである点に注意が必要です。したがって、すべてのWebブラウザやJavaScript実行環境で同じように動作するとは限りません。JavaScriptの標準的な機能としては、ECMAScript 2015(ES6)以降で標準化されたFunction.prototype.nameプロパティが推奨されます。nameプロパティは関数の定義に基づいて自動的に決定される正式な名前を提供し、より高い互換性を持っています。displayNameプロパティは、関数の実行に直接的な影響を与えるものではなく、あくまで開発者向けの表示補助として利用されるものです。

公式リファレンス: Function: displayName

構文(syntax)

1function myFunctionName() {
2  // ...
3}
4
5const functionDisplayName = myFunctionName.displayName;

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ