とある外部の javascript を呼び出す際にカスタマイズしたパラメータを渡すことができるのだけど、ページ表示後に Firebug コンソールから設定済みの変数の値をみると null になっていて、 javascript のソースには書いてあるのになんで中身が消えてるの？？と不思議に思ったので、デバッガを使って調べた。
Firebug を開き、スクリプトタブを選び、タブの上の段の XXXX.js みたいなのをクリックするとずらっとそのページで呼び出してるスクリプトファイル一覧が出てくるのでデバッグしたいスクリプトを選ぶ。
スクリプトのソースコードビューが出てくるので、「この関数のこの行の時点で、この変数の値がどうなってるかみたいんだよなぁ」という行の番号の左をクリックすると赤い丸印がつく。これがブレークポイント。ブラウザをリロードすると、ブレークポイントの行にさしかかったタイミングでスクリプトの実行が止まる。ソースコードビューのその行より上にかいてある変数名の上にマウスポインタをもっていくと変数の値が出てくる。
毎度毎度マウスカーソルを持って行くのは大変なので、監視を使う。右ペインの「監視」項目を選び、「新しい監視点...」をクリックして変数名を入力する。リロードするとブレークポイントで実行が止まり、監視の欄にさっき入力した変数の値がでる。
複数のブレークポイントを設定して、スクリプトの実行経過とともに変数の値が銅片かするかを追う。ブレークポイントで止まってるときに次のブレークポイントまで勧めるには F8 を押す（または再生の三角形のアイコンを押す）。何度も進めていくうちに変数の値が変わったりする。設定したブレークポイントを全部通過するとデバッグが終了して、ふつうにページを表示し終わった状態になる。
ステップイン/ステップアウト/ステップオーバーなどはいじってみたけどよくわからなかった。名前から想像するに、何重にも入れ子になってる関数の呼び出しを一階層ずつ下っていく、戻ってくるなどする機能だと思う。
文字だけでメモってもわかりづらいので、あとで時間のあるときに画面キャプチャを撮ろう。
