JavaScriptのデバッグ
新しいコンピュータコードを書くたびに、エラーが発生する可能性があります（発生します）。
コードのデバッグ
プログラミングコードには、構文エラーまたは論理エラーが含まれている可能性があります。
これらのエラーの多くは診断が困難です。
多くの場合、プログラミングコードにエラーが含まれていると、何も起こりません。エラーメッセージは表示されず、エラーを検索する場所が示されません。
プログラミングコードのエラーを検索（および修正）することをコードデバッグと呼びます。
JavaScriptデバッガー
デバッグは簡単ではありません。しかし幸いなことに、最近のすべてのブラウザーにはJavaScriptデバッガーが組み込まれています。
組み込みのデバッガーをオンまたはオフにして、エラーをユーザーに報告するように強制できます。
デバッガーを使用すると、ブレークポイント（コードの実行を停止できる場所）を設定したり、コードの実行中に変数を調べたりすることもできます。
通常、それ以外の場合は、このページの下部にある手順に従い、ブラウザでF12キーを使用してデバッグをアクティブにし、デバッガメニューで[コンソール]を選択します。
console.log（）メソッド
ブラウザがデバッグをサポートしている場合は、次を使用console.log()してデバッガウィンドウにJavaScript値を表示できます。
例
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
ヒント：console.log()このメソッドの詳細については、 JavaScriptコンソールリファレンスをご覧ください。
ブレークポイントの設定
デバッガウィンドウでは、JavaScriptコードにブレークポイントを設定できます。
各ブレークポイントで、JavaScriptは実行を停止し、JavaScript値を調べることができます。
値を調べた後、コードの実行を再開できます（通常は再生ボタンを使用）。
デバッガキーワード
キーワードはJavaScriptのdebugger実行を停止し、デバッグ関数を呼び出します（使用可能な場合）。
これは、デバッガーでブレークポイントを設定するのと同じ機能を持っています。
使用可能なデバッグがない場合、デバッガーステートメントは効果がありません。
デバッガーをオンにすると、このコードは3行目を実行する前に実行を停止します。
例
let x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
主要なブラウザのデバッグツール
通常、ブラウザでF12を使用してデバッグをアクティブにし、デバッガメニューで[コンソール]を選択します。
それ以外の場合は、次の手順に従います。
クロム
- ブラウザを開きます。
- メニューから[その他のツール]を選択します。
- ツールから「開発ツール」を選択します。
- 最後に、[コンソール]を選択します。
Firefox
- ブラウザを開きます。
- メニューから「Web開発者」を選択します。
- 最後に、「Webコンソール」を選択します。
角
- ブラウザを開きます。
- メニューから「開発者ツール」を選択します。
- 最後に、「コンソール」を選択します。
オペラ
- ブラウザを開きます。
- メニューから「開発者」を選択します。
- 「開発者」から「開発者ツール」を選択します。
- 最後に、「コンソール」を選択します。
サファリ
- メインメニューの[Safari]、[設定]、[詳細]に移動します。
- 「メニューバーに「現像メニューを表示」を有効にする」にチェックを入れます。
- メニューに新しいオプション「開発」が表示されたら、
「エラーコンソールの表示」を選択します。
知ってますか？
デバッグは、コンピュータープログラムのバグ（エラー）をテスト、検出、および削減するプロセスです。
最初に知られているコンピュータのバグは、電子機器に詰まった実際のバグ（昆虫）でした。