JavaScriptを自分で研究し、他の言語を学ぶ経験がない私のような人々にとって、最初はJavaScriptのデバッグも比較的難しい点でした。多くの基本的なことを自分で探求する必要があり、このプロセスは非常に憂鬱です。
私は機会を利用して、Debugging Experienceの共有と見なすことができるFireBugを使用して、上記の閉鎖ブログ投稿の写真をデモンストレーションすることを考えました。
サンプルコードは次のとおりです。
コードコピーは次のとおりです。
関数fn（）{
var max = 10;
return function bar（x）{
if（x> max）{
console.log（x）;
}
}
}
var fl = fn（）、
max = 100;
FL（15）;
FireBug -Scriptを選択します
右側の監視バーは、ウィンドウオブジェクトと変数を最大、フロリダ州、およびfnにすることができます。
同時に、以下のウィンドウのプロパティも確認できます。例として、例として、[コンソール]でwindow.location出力を直接実行し、場所のHREF属性値をさらに出力できます。もちろん、ウィンドウオブジェクトのプロパティと方法を参照する場合、フォーム「window.xxx」を使用する必要はなく、「xxx」を直接使用する必要はありません。
ポイントに戻る、
「スクリプト」列に戻り、JavaScriptをデバッグし、「ブレークポイント」を押して変数値を表示します。
最初に理解できるいくつかの概念があります：ブレークポイント、ステップバイステップエントリ、ステップバイステップスキップ、ステップバイステップの出口。ここでは説明しません。
今回は、主にブレークポイントを設定して段階的に入力する方法を使用します。
クリックして左側の線マークにブレークポイントを設定し、右クリックして定期的な判断を下すことができます。
複数のブレークポイントを設定でき、[ブレークポイント]列で設定されたブレークポイントを削除できます。
ここでは、スクリプトタグの開始時にポイントを直接壊し、ページを更新します。
現時点では
1.右側の監視領域にある元のウィンドウオブジェクトがこれになり、ウィンドウを指します。 「コンソール」のロケーションを出力すると、場所と同じ結果が得られます。
2。グローバル変数最大変数とFLは未定義に初期化されます
3。FN（）は関数宣言です。なぜなら、パーサーは最初に関数宣言を読み取り、コードを実行する前に利用可能にするため（アクセス可能）
右上隅の[シングルステップの入力]ボタンをクリックします
コードを段階的に実行して、これを表示し、各変数の値の変更、監視エリアのスタックを表示します。推奨ブログを参照できます。
次に、この別の例が来ます
コードは次のとおりです。
コードコピーは次のとおりです。
var name = 'window';
var obj = {
名前：「地元」、
getNameFunc：function（）{
console.log（this.name）;
return function（）{
console.log（this.name）;
};
}
};
var c = obj.getNameFunc（）;
c（）;
それでも「ステップイン」では、コードのc（）行を実行すると、getnamefuncを入力すると、これがポインティングからウィンドウオブジェクト、objに変更され、コンソールは「ローカル」を出力します。
ステップバイステップの実行により、コード全体の実行中のロジックを非常に明確に確認できます。
上記は、FireBugのデバッグ機能を使用してJavaScriptの閉鎖とこれを理解する方法の要約です。気に入っていただければ幸いです