4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

JavaScriptで関数の呼び出し元を知る方法

Posted at

JavaScriptで関数の呼び出し元を知る方法

はじめに

プログラミングの世界では、「どの関数からこの関数が呼ばれたのか?」を知りたい場面がよくあります。特に、JavaScriptで開発をしているとき、この情報がデバッグに非常に役立ちます。

今回は、JavaScriptで現在の関数がどの関数から呼ばれたかを表示する方法を、初心者の方にもわかりやすく説明します。

手順

1. Errorオブジェクトを作る

JavaScriptにはErrorというオブジェクトがあり、これを使ってエラー情報を得ることができます。ここでは、エラーを起こすのではなく、その機能を利用します。

const error = new Error();

2. スタックトレースを取得する

スタックトレースとは、プログラムの呼び出し履歴のことです。この履歴から、どの関数がどの順番で実行されたかを知ることができます。

const stack = error.stack || '';

3. 呼び出し元の関数を見つける

スタックトレースの中から、現在の関数の次に来る行が、呼び出し元の関数になります。

const stackLines = stack.split('\n');
const callerIndex = stackLines.findIndex(line => line.includes('getCaller')) + 2;

4. 関数名を表示する

最後に、見つけた呼び出し元の関数名をconsole.logを使って表示します。

if (stackLines[callerIndex]) {
  console.log(stackLines[callerIndex].trim());
}

実践例

上記の手順を組み合わせて、実際の関数で使ってみましょう。

function getCaller() {
  const error = new Error();
  const stack = error.stack || '';
  const stackLines = stack.split('\n');
  const callerIndex = stackLines.findIndex(line => line.includes('getCaller')) + 2;
  if (stackLines[callerIndex]) {
    return stackLines[callerIndex].trim();
  }
  return 'Unknown';
}

function yourFunction() {
  console.log('Called by:', getCaller());
  // ここに他のロジックを書く
}

function anotherFunction() {
  yourFunction();
}

anotherFunction();

このコードは、anotherFunctionからyourFunctionが呼ばれ、その結果として呼び出し元がコンソールに表示されます。

注意点

  • この方法は、ブラウザやJavaScriptの実行環境によって結果が異なることがあります。
  • スタックトレースの形式はブラウザによって異なりますので、異なるブラウザでの動作確認が必要です。
4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?