中断されたプログラムを調べる
デバッガーセッションが開始されると、デバッグツールウィンドウが表示され、ブレークポイントに到達するか、プログラムを手動で一時停止するまで、プログラムは正常に実行されます。
その後、プログラムは中断され、現在の状態を調べたり、実行を制御したり、実行時にさまざまなシナリオをテストしたりできます。
コールスタックを調べる
プログラムが一時停止されると、この時点に到達したコールスタック(英語)がフレームペインに表示されます。
マルチプロセス Node.js アプリケーションまたはサービスワーカーをデバッグしているときに、スレッドを切り替えることができます。フレームペインには、選択したスレッドの呼び出しスタックが表示されます。マルチプロセスデバッグおよびワーカーのデバッグから詳細を参照してください。
他の場合では、スレッドが 1 つしかない場合でも、フレームペインのスレッドフィールドにメインスレッドが表示されます。
フレームはアクティブなメソッドまたは関数呼び出しに対応します。呼び出されたメソッドまたは関数のローカル変数、その引数、式の評価を可能にするコードコンテキストを格納します。
メソッドが呼び出されるたびに、新しいフレームがスタックの一番上に追加されます。メソッドの実行が完了すると、対応するフレームがスタックから削除されます（後入れ先出し方式）。
フレームを調べると、特定のパラメーターがメソッドまたは関数に渡された理由と、呼び出し時の呼び出し元の状態を理解できます。
デフォルトでは、WebStorm はフレームワークとライブラリの呼び出しに対応するフレームを非表示にします。
ライブラリからフレームを表示
非表示のフレームを表示するには、フレームペインの右上隅にあるすべてのフレームを表示トグルボタン
を押します。ライブラリフレームを非表示にするには、フレームをライブラリから非表示トグルボタン
を放します。
スタックをクリップボードにコピー
現在のスレッドのコールスタックをコピーするには、フレームタブの任意の場所を右クリックして、スタックをコピーを選択します。
変数の調査 / 更新
変数タブには、選択したフレーム / スレッド内の変数のリストが表示されます。変数を調べると、プログラムが特定の方法で動作する理由を理解できます。
各変数の左側のアイコンは、その型を示しています。
変数のコピー
変数を調べるときに、変数名または値をコピーして別の場所に貼り付けたり、別の変数と比較したりする必要がある場合があります。
変数の名前をコピーするには、変数を右クリックして名前をコピーを選択します。
変数が保持する値をコピーするには、変数を右クリックして値をコピー Ctrl+C を選択します。
String以外の型の場合、toString表現がコピーされます。
変数をクリップボードと比較する
変数値を他の値と比較するには、クリップボードと値を比較オプションを使用します。これは、たとえば、変数に長い文字列が格納されていて、それを別の長い文字列と比較する必要がある場合に役立ちます。
たとえば、テキストファイルから比較するコンテンツをコピーします。
変数タブで変数を右クリックし、クリップボードと値を比較を選択します。
開いた差分ビューアーで相違点を調べます。差分ビューアーの詳細については、ファイルとフォルダーの比較を参照してください。
専用の変数を表示するダイアログ
WebStorm では、専用のダイアログで変数をインスペクションできます。これは、変数（または参照が保持されているオブジェクト）を追跡し、同時にフレームとスレッド間を移動できるようにする必要がある場合に便利です。
変数またはウォッチを右クリックし、インスペクションを選択します。
変数値を設定
プログラムが特定のデータに対してどのように動作するかをテストしたり、実行時にフローを変更したりする場合は、変数値を変更することでそれを実現できます。
変数を選択し、F2 を押します。または、コンテキストメニューから値の設定を選択します。
変数の値を入力し、Enter を押します。
ソースコードに移動する
変数ペインから宣言に移動できます。
変数が宣言されているコードに移動するには、変数を右クリックしてソースに移動 F4 を選択します。
変数型のクラス宣言に移動するには、変数を右クリックして型ソースに移動 Shift+F4 を選択します。
式の評価
WebStorm を使用すると、デバッグセッション中に式を評価して、プログラムの状態に関する追加の詳細を取得したり、実行時にさまざまな実行シナリオをテストしたりできます。
この機能は、プログラムがブレークポイントに到達した後に中断された（一時停止されていない）場合にのみ機能します。
式内で呼び出されるメソッド内にブレークポイントがある場合、それらは無視されます。
エディターで簡単な式を評価する
式をすばやく評価するには、エディターで式をポイントします。メソッド呼び出しはこの方法では評価できないことに注意してください。
評価する式をポイントします。式の結果がツールチップに表示されます。
子要素を表示するには、
をクリックするか、Ctrl+F1 を押します。
値のツールチップが邪魔になる場合は、遅延を増やすか、完全に無効にすることができます。これを行うには、設定ダイアログ (Ctrl+Alt+S) でに移動し、好みに応じて値ツールチップを表示および値ツールチップの遅延オプションを設定します。
エディターで複雑な式を評価する
メソッド呼び出しを伴うコード内の式を評価したい場合、または式のどの部分を評価するかについて特定したい場合は、式のクイック評価オプションを使用します。
式にキャレットを配置する（最も近い一致式を評価する）か、その一部を選択します（複雑な式のどの部分を評価するかを特定したい場合）。
Ctrl+Alt+F8 に移動します。または、Alt を押したまま選択をクリックします。
式のクイック評価を構成して、コードを選択するだけで（メニュー / ショートカットを使用せずに）コードで機能するようにできます。このオプションを有効にすると、誤ってメソッドを呼び出す可能性があるため、慎重に使用してください。
コード選択時に式を評価する
に移動し、コード選択時に値ツールチップを表示するオプションを設定します。
任意の式を評価する
任意の式を評価することは、最も柔軟な評価オプションです。現在のフレームのコンテキスト内にある限り、任意のカスタムコードを評価できます。これを使用すると、宣言、メソッド呼び出し、匿名クラス、アロー関数、ループなどを評価できます。
任意の式を評価するには、変数ペインの式の評価フィールドに式を入力して、を押します。Enter
結果はすぐ下に表示されます。式フィールドの右側にある
をクリックして、式をウォッチに追加することもできます。
長いコードブロックを評価する場合は、専用のダイアログを使用することをお勧めします。
現在目の前にある式または変数 (たとえば、エディターまたは変数ペイン) から開始する場合は、それを選択します。
Alt+F8 に移動するか、コンテキストメニューから式の評価を選択します。ショートカットは Ubuntu では機能しない可能性があります (正しく操作するには、ショートカット設定を調整してください )。
「評価」ダイアログで、選択した式を変更するか、「式」フィールドに新しい式を入力します。複数行のコードフラグメントを変更するには、「展開 Shift+Enter 」をクリックします。
評価（複数行モードの場合は Ctrl+Enter）をクリックします。式の結果が結果フィールドに表示されます。
式の結果は return ステートメントから取得されます。return ステートメントがない場合、結果はコードの最後の行から取得されます (式である必要さえありません。単一のリテラルでも機能します)。値を取得する有効な行がない場合、結果は
undefinedになります。指定された式を評価できない場合は、結果フィールドにその理由が示されます。
評価ダイアログは非モーダルなので、フォーカスをエディターに戻して他の変数や式をコピーすることができます。また、複数の評価ダイアログを開くこともできます。
インラインで値を表示
WebStorm は、変数の使用箇所のすぐ隣に変数の値を表示します。
変数値が変更されると、インラインビューが新しい値で更新され、色が変更されます。
行にオブジェクトへの参照が含まれている場合は、エディターでそのフィールドを直接調べることができます。このポップアップから、変数値を変更したり、インラインウォッチを追加したりすることもできます。
インラインビューはデフォルトで有効になっています。これをオフにするには、設定ダイアログ (Ctrl+Alt+S) でに移動し、値をインラインで表示するオプションを無効にします。
インラインウォッチを追加する
ある式の結果を特定の行に表示したい場合は、そのためのインラインウォッチを設定できます。インラインウォッチは永続的であり、セッションの再開後もアクティブなままです。
フィールドを追跡するオブジェクトを参照するインラインヒントをクリックします。
ポップアップで、フィールドを選択し、インラインウォッチとして追加をクリックします。
必要に応じてウォッチを微調整します。有効な式をウォッチとして使用できます。
エディターで設定したインラインウォッチは、デバッグツールウィンドウの変数ペインのインラインウォッチにも表示されます。
インラインウォッチを削除するには、ウォッチにカーソルを合わせ、近くの十字をクリックします。
ウォッチ式
変数またはより複雑な式の結果を追跡したい場合は、この変数または式の監視を設定します。これは、変数のリストに定期的に表示されないものを評価する必要がある場合や、インスタンス変数を固定する必要がある場合に便利で、各ステップの後にツリーを展開する必要がなくなります。
この機能は、プログラムがブレークポイントに到達した後に中断された（一時停止されていない）場合にのみ機能します。
ウォッチは、選択したフレームのコンテキストで評価されます。ウォッチは、コンテキストから外れている場合、またはコンパイルに失敗した場合は評価できません。この場合、ウォッチにはエラーアイコン 
のマークが付けられます。
デフォルトでは、監視は変数とともに変数ペインに表示されます。ウォッチ式ペインを表示 / 非表示にするには、レイアウト設定 
メニューの別々のウォッチオプションを使用します。
ウォッチを追加する
「変数」ペインの上部に式を入力し、「ウォッチポイントに追加」をクリックします。
ウォッチ式に変数 / 式を追加した後、変数 / 式はそこに残り、各ステップで評価され、現在のコンテキストで結果を提供します。
ウォッチを編集する
目的のウォッチを右クリックして、編集を選択します。
ウォッチをコピーする
コピーしたいウォッチを選択します。
変数ペインでウォッチ式の複製
をクリックするか、Ctrl+D を押します。
ウォッチの順序を変更する
便宜上、変数 / ウォッチ式ペインに表示されるウォッチの順序を変更できます。
変数 / ウォッチ式ペインのウォッチ式を上に移動 / ウォッチ式を下に移動ボタン、または Ctrl+Up および Ctrl+Down キーボードショートカットを使用します。
ウォッチを削除する
単一の監視を削除するには、それを右クリックしてウォッチ式の除去を選択します。または、ウォッチを選択し、変数 / ウォッチ式ペインで Delete を押します。
すべての監視を削除するには、変数 / ウォッチ式ペインの任意の場所を右クリックし、すべてのウォッチ式を除去を選択します。
ウォッチは、変数と同じアクションを可能にします。例: 専用のダイアログボックスで表示するか、ソースコードに移動するために使用できます。
ウォッチはプロジェクトの一部です。これは、デバッグセッションを失うリスクなしに、デバッグセッションを停止して再実行できることを意味します。
実行ポイント
現在の実行ポイントに戻る
プログラムの状態を調べるには、コード内を移動する必要があり、多くの場合、プログラムが中断されている場所に戻る必要があります。
以下のいずれか 1 つを実行します:
メインメニューで、に移動します。
Alt+F10 を押します。
デバッグツールウィンドウのステップツールバーで
をクリックし、リストから実行ポイントの表示 
を選択します。
現在の実行ポイントは青い線で示されます。この行のコードはまだ実行されていません。
関連ページ：
デバッガーセッションを開始する
デバッガーセッションは実行 / デバッグ構成に基づいています。構成タイプは、アプリケーションのタイプとランタイム環境によって異なります。一度に異なる設定で複数のデバッガーセッションを実行できます。構成を通じて、アプリケーションを起動するだけでなく、アプリケーションが起動する前に、WebStorm にいくつかのパラメーターを使用したり、いくつかのアクションを実行したりするように指示することもできます。例:Node.js 固有のコマンドラインオプションを Node.js 実行可能ファイルに渡すことが...
デバッグツールウィンドウ
デバッガーセッションを開始すると、WebStorm はデバッグツールウィンドウを開きます。このウィンドウでは、さまざまなデバッガーアクションを実行し、プログラムデータ（フレーム、スレッド、変数など）を分析できます。ツールウィンドウを使用する一般的な手順については、ツールウィンドウを参照してください。デフォルトでは、デバッグツールウィンドウは、プログラムがブレークポイントに到達したときにのみ表示され、デバッグセッションが終了した後も表示されます。この動作を変更するには、設定ダイアログ () を開き...
ブレークポイント
ブレークポイントは、特定のポイントでプログラムの実行を一時停止する特別なマーカーです。これにより、プログラムの状態と動作を調べることができます。ブレークポイントは、たとえば、特定のコード行に到達したときにプログラムを一時停止するなどの単純なものから、追加の条件をチェックしたり、ログに書き込んだりするなどのより複雑なロジックを含むものまであります。ブレークポイントは、一度設定すると、一時的なブレークポイントを除き、明示的に削除するまでプロジェクト内に残ります。ブレークポイントの種類：WebSto
マルチプロセスデバッグ
WebStorm を使用すると、child_process.fork() メソッドまたはクラスターモジュールによって起動される追加の Node.js プロセスをデバッグできます。このようなプロセスは、デバッグツールウィンドウのデバッガータブのフレームペインにスレッドとして表示されます。デバッグするプロセスにブレークポイントを設定します。Node.js の実行とデバッグの説明に従って、Node.js 実行 / デバッグ構成を作成します。ツールバーの実行ウィジェットリストから、新しく作成した構成を選択し、...
Chrome での JavaScript のデバッグ
WebStorm は、client-sideJavaScript コード用の組み込みデバッガーを提供します。以下のビデオと手順では、このデバッガーの使用を開始するための基本的な手順を説明しています。始める前に：設定で JavaScript Debugger バンドルプラグインが有効になっていることを確認します。を押して設定を開き、を選択します。インストール済みタブをクリックします。検索フィールドに JavaScript Debugger と入力します。プラグインの詳細については、プラグインのマッピン...
ファイル、フォルダー、テキストソースを比較する
WebStorm を使用すると、任意のファイル、フォルダー、テキストソース間の違い、ローカルファイルとそれらのリポジトリバージョン間の違いを確認できます。ファイルを比較：2 つまたは 3 つのファイルを比較するプロジェクトツールウィンドウで、比較するファイルを選択してを選択するか、を押します。または、1 つのファイルを選択し、コンテキストメニューから比較を選択して、プロジェクトの外部にあるファイルを選択します。アクティブなエディターをクリップボードと比較するエディターの任意の場所を右クリック...