---
title: デバッガー
slug: Tools/Debugger
tags:
  - Debugger
  - Debugging
  - Dev Tools
  - Tools
  - 'l10n:priority'
  - ツール
  - デバッガー
  - デバッグ
  - 開発ツール
translation_of: Tools/Debugger
---
<div>{{ToolsSidebar}}</div>

<div>JavaScriptデバッガを使用すると、JavaScriptコードをステップ実行してその状態を調べたり変更したりして、バグを追跡することができます。</div>

<div class="note">
<p>このページは、Firefox 52 以降の Firefox Nightly および Firefox Developer Edition で使用できる JavaScript デバッガーについて説明します。</p>

<p>これより前のバージョンの Firefox や Firefox Beta および Release については、<a href="/ja/docs/Tools/Debugger_%28before_Firefox_52%29">デバッガー (Firefox 52 より前)</a> をご覧ください。</p>

<p>このバージョンのデバッガーを使用できる環境で旧デバッガーに戻す必要がある場合は、about:config で設定項目 "devtools.debugger.new-debugger-frontend" に <code>false</code> を設定してください。</p>
</div>

<p>{{EmbedYouTube("QK4hKWmJVLo")}}</p>

<p>JavaScript デバッガーでは、バグを追究するために JavaScript コードのステップ実行やコードの状態の調査または変更が可能です。</p>

<p>Firefox でローカル実行しているコードや、例えば Android 版 Firefox が動作する Android デバイスなどのリモートで実行しているコードのデバッグに使用できます。特定のブラウザーに接続する手順については、<a href="/ja/docs/Tools/Remote_Debugging">リモートデバッグ</a> のページをご覧ください。</p>

<p>デバッガーは Firefox に内蔵して提供しており、本ページでは Firefox に埋め込まれているデバッガーの使用方法を説明します。一方、デバッガーはスタンドアローンのウェブアプリケーションとして使用することもでき、他のブラウザーや Node で実行しているコードをデバッグできます。詳しくは <a href="https://github.com/devtools-html/debugger.html">プロジェクトの GitHub リポジトリー</a> をご覧ください。</p>

<p>新しいデバッガーは、旧デバッガーの一部機能を (まだ) サポートしていません。<a href="/ja/docs/Tools/Debugger/Limitations_of_the_new_debugger">新しいデバッガーの制限事項</a> をご覧ください。</p>

<hr>
<h2 id="User_Interface_Tour" name="User_Interface_Tour">ユーザーインターフェイスツアー</h2>

<p>デバッガーについてひととおり理解するために、<a href="/ja/docs/Tools/Debugger/UI_Tour">UI のクイックツアー</a> を用意しました。</p>

<hr>
<h2 id="How_to" name="How_to">使い方</h2>

<p>デバッガーで何ができるかを知るために、以下のガイドをご覧ください:</p>

<div class="twocolumns">
<ul>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Open_the_debugger">デバッガーを開く</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Set_a_breakpoint">ブレークポイントを設置する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Set_a_conditional_breakpoint">条件付きブレークポイントを設置する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Disable_breakpoints">ブレークポイントの無効化</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Step_through_code">コードをステップ実行する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Breaking_on_exceptions">例外でブレークする</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Set_Watch_Expressions">監視式を設定する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Pretty-print_a_minified_file">圧縮されたファイルを整形表示する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Search">検索する</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Debug_eval_sources">eval ソースをデバッグする</a></li>
 <li><a href="/ja/docs/Tools/Debugger/How_to/Use_a_source_map">ソースマップを使用する</a></li>
</ul>
</div>

<hr>
<h2 id="Reference" name="Reference">リファレンス</h2>

<div class="twocolumns">
<ul>
 <li><a href="/ja/docs/Tools/Debugger/Keyboard_shortcuts">キーボードショートカット</a></li>
 <li><a href="/ja/docs/Tools/Debugger/Source_map_errors">ソースマップのエラー</a></li>
</ul>
</div>