JavaScript エラーと Error.stack プロパティ

JavaScript エラーと Error.stack プロパティ

スタックトレースは、エラー発生時に実行されていた関数とその呼び出し順序を記録したものです。具体的には、以下の情報が含まれます。

• 各関数の名前
• 各関数のファイル名と行番号
• 関数の引数

スタックトレースを活用することで、以下のことが可能になります。

• エラー発生箇所を特定する
• エラー発生原因を分析する
• デバッグ作業を効率化する

Error.stack プロパティは、Error オブジェクトのインスタンスプロパティです。以下のコードのように、Error オブジェクトから直接アクセスできます。

const error = new Error('エラーが発生しました');
console.log(error.stack);

出力例：

Error: エラーが発生しました
    at Object.<anonymous> (index.js:10:11)
    at Module._compile (internal/modules/cjs/loader.js:1158:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
    at Module.load (internal/modules/cjs/loader.js:1067:32)
    at Function.Module._load (internal/modules/cjs/loader.js:975:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47

この例では、エラー発生箇所が index.js ファイルの 10 行目であることが分かります。

スタックトレースの活用例

スタックトレースは、エラーの特定とデバッグに役立ちます。

エラー発生箇所の特定

スタックトレースは、エラー発生時の関数とその呼び出し順序を示します。この情報から、エラーが発生した箇所を特定することができます。

エラー発生原因の分析

スタックトレースは、各関数の引数も表示します。この情報から、エラー発生原因を分析することができます。

デバッグ作業の効率化

スタックトレースを活用することで、デバッグ作業を効率化することができます。例えば、以下のようなことができます。

• 特定の関数の呼び出し前後で変数の値を確認する
• ブレークポイントを設定して、コードの実行をステップ実行する

注意点

• ブラウザや JavaScript エンジンによって、スタックトレースの形式が異なる場合があります。
• スタックトレースには、すべての関数が表示されるわけではありません。
• 複雑なコードの場合、スタックトレースが長くなりすぎて見づらくなることがあります。

Error.stack プロパティは、エラー発生時のコード実行状況を示すスタックトレースを提供します。スタックトレースを活用することで、エラーの特定とデバッグを効率化することができます。

JavaScript エラーと Error.stack プロパティのサンプルコード

function func1() {
  throw new Error('エラーが発生しました');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.stack);
}

出力例：

Error: エラーが発生しました
    at func1 (index.js:10:11)
    at func2 (index.js:15:5)
    at Object.<anonymous> (index.js:20:9)
    at Module._compile (internal/modules/cjs/loader.js:1158:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
    at Module.load (internal/modules/cjs/loader.js:1067:32)
    at Function.Module._load (internal/modules/cjs/loader.js:975:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47

エラーメッセージとスタックトレースをカスタマイズ

class MyError extends Error {
  constructor(message) {
    super(message);
    this.name = 'MyError';
  }
}

function func1() {
  throw new MyError('エラーが発生しました');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.name); // MyError
  console.log(error.stack);
}

出力例：

MyError
Error: エラーが発生しました
    at func1 (index.js:10:11)
    at func2 (index.js:15:5)
    at Object.<anonymous> (index.js:20:9)
    at Module._compile (internal/modules/cjs/loader.js:1158:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
    at Module.load (internal/modules/cjs/loader.js:1067:32)
    at Function.Module._load (internal/modules/cjs/loader.js:975:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47

非同期処理でのエラー

async function func1() {
  throw new Error('エラーが発生しました');
}

async function func2() {
  await func1();
}

try {
  await func2();
} catch (error) {
  console.log(error.stack);
}

出力例：

Error: エラーが発生しました
    at async func1 (index.js:10:11)
    at async func2 (index.js:15:5)
    at Object.<anonymous> (index.js:20:9)
    at Module._compile (internal/modules/cjs/loader.js:1158:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
    at Module.load (internal/modules/cjs/loader.js:1067:32)
    at Function.Module._load (internal/modules/cjs/loader.js:975:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47

Promise でのエラー

function func1() {
  return new Promise((resolve, reject) => {
    reject(new Error('エラーが発生しました'));
  });
}

async function func2() {
  await func1();
}

try {
  await func2();
} catch (error)

JavaScript エラーと Error.stack プロパティのその他の方法

Error オブジェクトの message プロパティは、エラーメッセージを格納します。デフォルトでは、エラーの種類と簡単な説明が表示されますが、message プロパティを書き換えることで、より詳細な情報を提供することができます。

function MyError(message) {
  super(message);
  this.name = 'MyError';
  this.message = `エラーが発生しました: ${message}`;
}

function func1() {
  throw new MyError('ファイルが見つかりません');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.message); // エラーが発生しました: ファイルが見つかりません
}

スタックトレースのフォーマット

Error オブジェクトの stack プロパティは、スタックトレースを格納します。デフォルトでは、各フレームの情報は1行に表示されますが、stack プロパティを書き換えることで、より詳細なフォーマットで表示することができます。

function MyError(message) {
  super(message);
  this.name = 'MyError';
  this.stack = `エラーが発生しました: ${message}\n${this.stack}`;
}

function func1() {
  throw new MyError('ファイルが見つかりません');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.stack);
  // エラーが発生しました: ファイルが見つかりません
  //    at func1 (index.js:10:11)
  //    at func2 (index.js:15:5)
  //    at Object.<anonymous> (index.js:20:9)
  //    ...
}

エラーオブジェクトの拡張

Error オブジェクトは、独自のプロパティやメソッドを追加することができます。

class MyError extends Error {
  constructor(message) {
    super(message);
    this.name = 'MyError';
    this.code = 404;
  }
}

function func1() {
  throw new MyError('ファイルが見つかりません');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.name); // MyError
  console.log(error.code); // 404
}

フレーム情報のカスタマイズ

Error オブジェクトの prepareStackTrace メソッドは、スタックトレースの各フレーム情報をカスタマイズするために使用することができます。

Error.prepareStackTrace = (error, stack) => {
  return stack.map((frame) => {
    frame.fileName = frame.fileName.replace('index.js', 'my-file.js');
    return frame;
  });
};

function func1() {
  throw new Error('エラーが発生しました');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.stack);
  // エラーが発生しました
  //    at func1 (my-file.js:10:11)
  //    at func2 (my-file.js:15:5)
  //    at Object.<anonymous> (my-file.js:20:9)
  //    ...
}

フレーム情報のフィルタリング

Error オブジェクトの captureStackTrace メソッドは、スタックトレースから特定のフレームを除外するために使用することができます。

Error.captureStackTrace = (error, stack) => {
  return stack.filter((frame) => {
    return !frame.fileName.includes('internal');
  });
};

function func1() {
  throw new Error('エラーが発生しました');
}

function func2() {
  func1();
}

try {
  func2();
} catch (error) {
  console.log(error.stack);
  // エラーが発生しました
  //    at func1 (index.js:10:11)
  //    at func2 (index.js:15:5)
  //    at Object.<anonymous>